Feature icons block

Feature Icons Block

The Feature Icons block allows you to showcase product highlights using visually appealing icons. Powered by metafields, this feature enables you to store and display a list of custom icons on the product page. Whether you want to emphasize product attributes, unique features, or available facilities, this block provides flexibility and customization to fit your needs. With adjustable settings, you can tailor the icon display to match your branding and enhance the product presentation.

Settings

How to Create a Metafield for the Feature Icons Block

Follow these steps to properly set up a metafield for the Feature Icons block:

1. Create a Metaobject for Feature Icons

  • Go to ContentMetaobjects and click Add definition.
  • Name it (e.g., Product Feature Icon).
  • Add the following fields:
    • Single line text – Name it Label (stores the feature name).
    • File – Name it Image (stores the icon). Under Accept specific file types, select Images only
Single line text field
File field
Product feature icon metaobject
  • Click Save.

2. Add Entries for Feature Icons

  • Go to ContentMetaobjects, select the metaobject created in Step 1.
  • Click Add entry.
  • Enter a Label and upload an Image for each feature icon.
  • Repeat for all feature icons needed.

3. Create a Metafield for Feature Icons

  • Go to SettingsCustom DataProducts and click Add definition.
  • Name it (e.g., Feature Icons).
  • Select Metaobject as the type and reference the metaobject created earlier (Product Feature Icon).
  • Enable List of entries.
  • Click Save.

4. Add the Feature Icons Block in the Theme Editor

  • Open Online StoreCustomize.
  • Select the Product template.
  • In the Product Information section, click Add block and choose Feature Icons.
  • In the Metafield setting, enter the namespace and key (e.g., custom.feature_icons).

5. Save and Apply

  • Adjust block settings as needed.
  • Click Save and preview the product page to ensure proper display.