How to set up the product highlight feature with metafields

Product Highlights are a powerful way to showcase key selling points directly on your product cards, helping customers make faster, more informed purchase decisions—without needing to click into each product page.

Why use Product Highlights?

As a merchant, you may want to:

• Show more product details (like fit or material) directly on collection and featured sections.
• Display colour options to improve product discoverability.
• Highlight unique selling points (USPs) for each product using dynamic content.
• Increase conversion rates by presenting essential information upfront.

Product Highlights allow you to do all of the above by enhancing your product card design with extra details and a colour variant slider. This feature is fully customisable and built to support dynamic content through metafields.

Where Product Highlights appear

Product Highlights can be shown on product cards across multiple sections of your theme, including:

• Featured Collection
• Shop the Look
• Multi Collections
• Collection Page
• Collection List Page
• Recommended Products
• Recently Viewed Products

Each of these sections supports the display of Product Highlights, allowing you to maintain consistency and a strong visual message across your entire storefront.

What can you display?

You have full control over which highlights to show. Common examples include:

• Fit – e.g., “Regular Fit”, “Oversized”
• Material – e.g., “100% Organic Cotton”
• Colour Count – e.g., “Available in 5 colours”
• USPs – e.g., “Ethically Made”, “Wrinkle Resistant”, “Breathable Fabric”

You can connect to metafields to show unique content for each product.

This guide will walk you through three steps:

1. Creating metafields
2. Assigning product content to metafields
3. Linking metafields to Product Highlights in the Theme Editor

1. Creating metafields

To showcase unique product attributes or USPs, start by creating metafields in your Shopify admin.

Step 1: Go to Settings in your Shopify admin.

Step 2: Click Metafields and metaobjects.

Step 3: Select Products.

Step 4: Click Add Definition, and enter the details for each highlight you'd like to display.

Example:

• Name: highlights
• Description: Product Card Highlights

Step 5: Under Type, choose Single line text for short entries like “Ethically Made”, or Multi-line text if you want a longer message. This supports all Text and Image types.

Part 2: Assigning content to metafields

Once your metafields are created, you’ll add product-specific content.

Step 1: Navigate to Products in your Shopify admin.

Step 2: Click on a product and scroll down to the Metafields section.

Step 3: Enter your content for your metafield.

Step 4: Save your changes.

Part 3: Linking metafields to Product Highlights

Once your products have content, you can connect those metafields to the Product Highlights display in the Theme Editor.

Step 1: Go to Online Store > Themes and click Customize.

Step 2: Navigate to a section that displays product cards (e.g., Collection Page, Featured Collection).

Step 3: Open the settings for the product grid or card layout.

Step 4: Locate the Product Highlights area.

Step 5: Enable the 'Show Highlights' option and add in your Metafield reference eg. product.metafields.custom.highlights   

Step 6: Save your changes.

Each product card will now dynamically show the appropriate highlights you've set, keeping your content relevant and your selling points front and centre.

Need Help?

If you need guidance setting up metafields or configuring your product card highlights, feel free to reach out. We’re here to help!