Ingredient Details Block

Estimated reading: 2 minutes

With the Ingredient Details block, you can present information like the nutritional values of your product in a typical table-like format.

Similar to the Collapsible Row block, the content can be added in two ways:

  1. Directly into the block’s text field: In this case, the same content will be displayed for all products.
  2. Using product-specific content with metafields: This allows you to customize the information for each product.

Formatting Information

In both cases, the formatting of the ingredient information works the same way. As shown in the default table loaded when you add the block, you can use the following symbols to format the content:

  • Use a comma “,” to separate the ingredient label and value.
  • Use a hyphen “-“ to indent a row.
  • Press SHIFT + ENTER to add a new row.
  • You can also use the Bold, Italic, and Link options from the editor.

Important: The editor’s Heading and List options cannot be used.

Using Metafields

This block will, in most cases, be used for product-specific information. To achieve this, setting up a product metafield is required.

How to Set Up a Product Metafield

  1. Create a Metafield:
    • Go to your Shopify dashboard -> Settings -> Custom data -> Products, and click Add definition (top right).
    • Name your metafield (e.g., Nutritional information), select Rich text as the type, and save the metafield.
  2. Add Product-Specific Information:
    • Go to Products and find the metafield you created in the Metafields section.
    • Add the information using the formatting rules described above. Repeat this process for every product that needs this information.
  3. Connect the Metafield to the Ingredient Block:
    • Open the theme customizer, navigate to the Ingredient block settings, and click the dynamic source icon above the Content box.
    • Select the created metafield.

The product-specific information will now be displayed dynamically on all products where you have added information in the metafield.

For more information on Shopify metafields please check these articles:

Share this Doc

Ingredient Details Block

Or copy link