How to Add Product Metafields/Attributes

This article explains how to add product metafields/attributes to products on your quiz's results page.

ShopifyShopify (Legacy)WooCommerceMagentoBigCommerceStandalone

Note

The app can only sync and show the string, single_line_text_field, multi_line_text_field, date, and number product metafields. Rich_text_fields metafields are not currently supported.

In product variant slots, metafield blocks currently display metafields from the parent product, not variant-level metafields.

Metafields in Shopify hold product properties that an ecommerce platform does not show by default. In Germany, for example, a cosmetic product must show the "Grundpreis", the per 100ml price. Metafields make that possible. The 💎Built for Shopify version of the RevenueHunt app also has a Unit price setting under Slot item composition.

The 💎Built for Shopify version of the RevenueHunt app has fewer steps for adding and displaying metafields. Follow these steps to import product metafields from your store into the Product Recommendation Quiz and display them on your quiz's results page:

Step 1: Enable Metafields Display

To enable the display of metafields for individual products:

1. Navigate to the Results page tab in the Quiz builder.
2. Add a Product block and open its settings.
3. In the Product components layout, click + blockand add the Metafieldsection.
4. From the Select metafield section, select the metafield you want to display.
5. For the 💎Built for Shopify live quiz, the metafield definition in Shopify must have Storefront API access enabled/readable.
6. You can also add a Text block to the product layout. Insert the metafield value as a content dynamic source, so it sits inside your own text.
7. Save the changes with the top-right Save button.

The selected metafield then appears in the product block, as part of the recommended product.

Tip

If a custom metafield is missing from the list, force a catalog sync:

1. Go to App settings > Catalog.
2. Click the Import catalog button to trigger a manual sync.

Note

The app can only sync and show the custom text product metafields.

Metafields in Shopify hold product properties that an ecommerce platform does not show by default. In Germany, for example, a cosmetic product must show the "Grundpreis", the per 100ml price. Metafields make that possible.

To import product metafields from your store and show them on the results page, follow these steps:

Step 1: Enable Metafields Display

First, enable the display of metafields for individual products:

1. Navigate to your Results Page Settings > Basic.
2. Open the Individual Product Settings section.
3. Activate the show metafields toggle.

Step 2: Open App Settings

Open App Settings > Catalogue to access the settings to manage your catalog.

Step 3: Select Metafields

Select the Metafields namespaces you want to sync with the app by clicking the toggle icon next to each.

Step 4: Sync the Catalog

Update your catalog with the new metafields by triggering a catalog sync from your dashboard.

Step 5: Implement Custom JavaScript on the Results Page

To display the metafield values on your results page, custom JavaScript is required:

1. Your developer writes custom JavaScript to render the metafield value where you want it on the results page.
2. This customization is outside the support scope of the app.

This sample code replaces the product description with the descriptors-subtitle metafield. This code should be added in the Custom JavaScript input under Results Page Settings > Advanced Settings:

window.recommendedProducts = prq.recommendedProducts();
var products = document.querySelectorAll('.lq-product');

for (let i = 0; i < products.length; i++) {
  let id = products[i].id;
  let oneId = id.match(/^\d/) ? ("#\\3" + id.charAt(0) + " " + id.substring(1)) : "#" + id;
  let product = window.recommendedProducts.find(product => product.id === id);

  if (product.metafields['descriptors-subtitle']) {
    let toEdit = document.querySelectorAll(oneId + ' .lq-hcont');

    for (let j = 0; j < toEdit.length; j++) {
      if (!toEdit[j].hasAttribute("edited")) {
        toEdit[j].insertAdjacentHTML('beforeend', '<span>' + product.metafields['descriptors-subtitle'] + '</span>');
        toEdit[j].setAttribute("edited", "true");
      }
    }
  }
}

Attributes in WooCommerce hold product properties that an ecommerce platform does not show by default. In Germany, for example, a cosmetic product must show the "Grundpreis", the per 100ml price. Attributes make that possible.

To import product attributes from your store and show them on the results page, follow these steps:

Step 1: Enable Attributes Display

First, enable the display of attributes for individual products:

1. Navigate to your Results Page Settings > Basic.
2. Open the Individual Product Settings section.
3. Activate the show metafields toggle.

Step 2: Open App Settings

Open App Settings > Catalogue to access the settings to manage your catalog.

Step 3: Select Attributes

Activate the Pass attribute information to result page setting by clicking the toggle.

Step 4: Sync the Catalog

Update your catalog with the new attributes by triggering a catalog sync from your dashboard.

Step 5: Implement Custom JavaScript on the Results Page

To display the metafield values on your results page, custom JavaScript is required:

1. Your developer writes custom JavaScript to render the metafield value where you want it on the results page.
2. This customization is outside the support scope of the app.

This sample code replaces the product description with the descriptors-subtitle metafield. This code should be added in the Custom JavaScript input under Results Page Settings > Advanced Settings:

window.recommendedProducts = prq.recommendedProducts();
var products = document.querySelectorAll('.lq-product');

for (let i = 0; i < products.length; i++) {
  let id = products[i].id;
  let oneId = id.match(/^\d/) ? ("#\\3" + id.charAt(0) + " " + id.substring(1)) : "#" + id;
  let product = window.recommendedProducts.find(product => product.id === id);

  if (product.metafields['descriptors-subtitle']) {
    let toEdit = document.querySelectorAll(oneId + ' .lq-hcont');

    for (let j = 0; j < toEdit.length; j++) {
      if (!toEdit[j].hasAttribute("edited")) {
        toEdit[j].insertAdjacentHTML('beforeend', '<span>' + product.metafields['descriptors-subtitle'] + '</span>');
        toEdit[j].setAttribute("edited", "true");
      }
    }
  }
}

Not available on this platform

This version of the app does not import product attributes, so they cannot be shown on the results page.

Not available on this platform

This version of the app does not import product custom fields, so they cannot be shown on the results page.

Not available on this platform

The Standalone version has no store to import metafields from. Add the product details you need directly in the Catalogue, as How to Add Products in Standalone RevenueHunt App describes.

How to use metafields as smart collections

ShopifyShopify (Legacy)WooCommerceMagentoBigCommerceStandalone

Shopify lets you use product metafields as conditions in a smart collection.

Smart collections from metafields

For more, see the Shopify documentation on Smart collections from metafields.

This is useful if you want to organize products by custom attributes (like Skin Concern = Acne or Subscription Eligible = True) and then connect those collections to your RevenueHunt quiz.

Supported Metafield Types

You can use the following product metafield types in smart collections:

• Single line text
• Single line text (list)
• True or false (boolean)
• Integer
• Decimal
• Rating

Step by step guide:

1. Create Product Metafields: In Shopify Admin, go to Settings → Custom data → Products.

   • Click Add definition.
   • Select one of the supported metafield types and give it a clear name, such as Skin Concern, Organic Certified or SPF Rating.
   • Save the metafield definition.

2. Add Metafield Values to Products: Open a product in Shopify Admin. Scroll down to the Metafields section. Enter the value for the metafield you created. Example: Skin Concern = Acne. Repeat for all relevant products.

3. Create a Smart Collection Using Metafields: Go to Products → Collections.

   • Click Create collection.
   • Choose Automated collection.
   • Under Conditions, open the field dropdown and select Product metafields.
   • Select your metafield (e.g. Skin Concern).
   • Define the condition (e.g. equals → Acne).
   • Save the collection. Now, Shopify automatically groups products based on metafield values.

4. Use Smart Collections in RevenueHunt: Open your quiz in the RevenueHunt app. Edit a question and add a Choice. Instead of linking individual products, select the Shopify collection you created. Example: Quiz answer “Acne-prone skin” → Collection Skin Concern = Acne. Save and publish your quiz.

Shopify lets you use product metafields as conditions in a smart collection.

Smart collections from metafields

For more, see the Shopify documentation on Smart collections from metafields.

This is useful if you want to organize products by custom attributes (like Skin Concern = Acne or Subscription Eligible = True) and then connect those collections to your RevenueHunt quiz.

Supported Metafield Types

You can use the following product metafield types in smart collections:

• Single line text
• Single line text (list)
• True or false (boolean)
• Integer
• Decimal
• Rating

Step by step guide:

1. Create Product Metafields: In Shopify Admin, go to Settings → Custom data → Products.

   • Click Add definition.
   • Select one of the supported metafield types and give it a clear name, such as Skin Concern, Organic Certified or SPF Rating.
   • Save the metafield definition.

2. Add Metafield Values to Products: Open a product in Shopify Admin. Scroll down to the Metafields section. Enter the value for the metafield you created. Example: Skin Concern = Acne. Repeat for all relevant products.

3. Create a Smart Collection Using Metafields: Go to Products → Collections.

   • Click Create collection.
   • Choose Automated collection.
   • Under Conditions, open the field dropdown and select Product metafields.
   • Select your metafield (e.g. Skin Concern).
   • Define the condition (e.g. equals → Acne).
   • Save the collection. Now, Shopify automatically groups products based on metafield values.

4. Sync changes: Open your quiz in the RevenueHunt app and run a quick catalog sync.

5. Link Smart Collections in RevenueHunt: In the Quiz Builder, open the Link Collections tab and link the smart collection to a choice.
6. Click Publish to save your changes.

You can use attributes as categories in the RevenueHunt app for WooCommerce.

To do that:

1. Open App Settings > Catalogue to access the settings to manage your catalog.
2. Activate the Use attributes as categories setting by clicking the toggle.

3. Update your catalog with the new attributes by triggering a catalog sync from your dashboard. 4. Go to the Link Collections tab in the Quiz Builder and link the attributes to a choice. 5. Click Publish to save your changes.

Not available on this platform

Smart collections built from product attributes are a Shopify feature. This version of the app does not have an equivalent.

Not available on this platform

Smart collections built from product attributes are a Shopify feature. This version of the app does not have an equivalent.

Not available on this platform

The Standalone version has no store to build smart collections from. Create collections by hand in the Catalogue instead.

---

Following these steps will enable you to display specific metafields on your quiz's results page, ensuring compliance with local regulations and improving your product presentations.