Product Features

This block displays an icon with text. Use this block to display your product's or company's features.

Set up block

  1. Select the product Template to edit from the dropdown menu in the top bar, got to Products > Default product.
  2. Click on Product features block to open the block settings.
    • If the Product features block doesn’t exist, in the side panel, under the Product content section click + Add block and select Product features block.
  3. Change the order of your blocks by using the drag and drop handles ⋮⋮
  4. You will find 6 features to edit, you can add from 1 to 6 features to a product, leaving the heading of the feature empty will hide it. 
    1. Add Heading text to add a heading for the feature, this will display below the icon.
    2. Select the Select an icon option to choose an icon from our default icons list, this icon will display above the heading. If you don't want an icon you can select the option none in the list and this will hide the icon.


      Note: for use a dynamic icon for each product is required to use the Custom icon option otherwise the icon selected here will appear on all product pages.

    3. (Optional) Click Select image on the Custom icon option and use the file selector to select an image from your library or upload a new icon file. We recommend use a PGN format with a size of 140 x 140, use the Secondary text color for the icon color, you can find this color on Theme Settings > Colors.
  5. Add Text to add further description to the feature. Leave this field empty if you want to remove the description.
  6. Click Save.

Note: Leaving Heading option field empty will hide the Feature, for example if you remove the Heading text from Feature 1 then the feature will be hidden on the product page.

Define Metafields

Creating Metafields is the way how you can add dynamic content to your sections and blocks. To learn more information about Metafields please visit Shopify's guide Metafields. In the next steps, we will show you how to add Metafields and connect dynamic sources on the Product features block. As an example, we will create a Metafield for FEATURE 1 Title.

Create Title Metafield

Create a Text Metafield to add a Heading to FEATURE 1.

  1. Click the Dynamic source button next to the Heading option in the Product features block settings.
  2. Click on the top dropdown menu and select the template where you want to create the Metafield. In this case, we will use Product.

  3. Click the (+) Add Metafield button.
  4. Add the name of the Metafield. This name should describe the purpose of the Metafield. For this example we will use, Feature title 1. We recommend adding a name that makes it easy to identify later.
  5. Click the (+) Select content type button and under the Text tab select Single line text
  6. Click Save.

Note: You only need to complete these steps once per data type. Do not make a new Metafield for every product.

Add content to product Metafields

After you create a Metafield, the next step is to add content to it.

  1. Go to Products on your Shopify Admin and select a product.
  2. Scroll down to the Metafields section and add your content in the Metafield you created. For this example, add content to the Feature title 1 Metafield that you created in the previous step.
  3. Repeat steps 1 - 2 for every product to which you want to add dynamic content. If you have many products, you can edit Metafields in bulk. Learn more about how to edit product Metafields in bulk.
  4. Click Save.

Insert Metafields as dynamic sources

Once you create a Metafield and add content to it, add it as dynamic source in your theme. 

  1. Navigate to your Theme Editor.
  2. In the dropdown menu in the top bar, select the Product template to which you want to add the Metafield data.
  3. Go to the Product features block.
  4. Click the Dynamic source button next to the Heading field in the FEATURE 1 section.
  5. Select the Metafield that you created.
  6. Click Save.

Note: The previous steps are an example that shows how to add dynamic content to the Heading field in Feature 1. You can add dynamic content to the other fields by following the same steps and varying the Metafield name and content type.

These are the recommended content types for every field in Product features block:

Setting Field Metafield Content Type
Heading Text > Single line text
Text Text > Multi-line text
Custom icon File

Note: Any change applied to this block will appear on all pages that use the same template.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us