Product Features

This block display an icon with text. use this block to add any product feature or additional info.

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, will take as an example 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 the (+) Create Metafield button.
3. Click on the Products tab. In this case, we want to add dynamic content on the product page that's why we select Products tab.
4. Click Add definition button in the top-right.
5. Add the name of the Metafield, this name should describe the purpose of the Metafield. For example "Feature title 1", we recommend adding a name that makes it easy to identify later.
6. Click the (+) Select content type button and under the Text tab select Single line text. 
7. Click Save.

Add content to product Metafields

After create your Metafield you can add your content.

1. Go to Products on your Shopify admin and select one of your products.
2. Scroll down to the Metafields section and add your content in the Metafields that you created, for example, add content in the Feature title 1 Metafield that you created in the previous steps.
3. Repeat steps 1 - 2 to add the different content to the Metafields for your products. Shopify offers the feature to edit Metafields in bulk to learn more please visit Editing product Metafields in bulk.
4. Click Save.

Insert Metafields as dynamic sources

Once you create the Metafield and add your content, you can add this as dynamic source in the Frame theme, In your theme editor  (Customize):

1. Go to the Product features block settings.
2. Click the Dynamic source button next to the Heading field under FEATURE 1 section.
3. Select the Metafield that you created and added content to.
4. Click Save.
5. Now you can see the dynamic content you added to the different products.

Note: The previous steps are an example that shows how to add dynamic content for the Heading field in Feature 1. You can add dynamic content to the other setting fields by following the same steps above. Please note the metafield content type and name varies depending the field content, For example if the field content is an image like custom icon field then you will need to create a Metafield with content type: File  .

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

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