How to Use Metaobjects on Product template with Image with text - simple section
Learn how to display product-specific content using metaobjects and the Image with Text section.
Overview
You can use metaobjects to create custom content blocks for specific products. When a product has an associated metaobject, the section will display that content. If no metaobject is associated, the section can be hidden automatically.
Setup Instructions
1. Create a Metaobject Definition
First, create a metaobject type for your product content:
Go to Settings > Custom data > Metaobjects
Click Add definition
Configure the metaobject:
Name: Product Content Block
Type: product_content
Add these fields:
Heading (Single line text)
Content (Multi-line text)
Image (Media)
Button Label (Single line text) - Optional
Button Link (Single line text) - Optional
2. Create Content Using Metaobjects
Create content blocks for your products:
Go to Content > Metaobjects
Click Add Product Content Block
Fill in the fields:
Heading: e.g., "How to Use"
Content: Your product information
Image: Upload a relevant image
Button Label: e.g., "Learn More"
Button Link: URL or handle
3. Associate with Products
Link the metaobject to specific products:
Go to Products
Edit the product
Scroll to Metafields
Click Add metafield
Choose your metaobject type
Select the content block you created
4. Set Up the Section
Add the Image with Text section to your product template:
Go to Online Store > Themes
Click Customize
Select a product page
Add "Image with text - simple" section
Configure other design settings as needed
In section settings:
Enable "Enable metafield detection"
How It Works
When a customer views a product, the section checks for an associated metaobject
If found, it displays the content from the metaobject
If no metaobject is associated and metafield detection is enabled, the section hides
Content updates automatically when you edit the metaobject
Example Use Cases
Product Features
Care Instructions
Origin Story
Tips & Best Practices
Use consistent image sizes
Keep headings concise
Write clear, scannable content
Use high-quality images
Test on multiple products
Troubleshooting
Section Not Showing?
Verify metaobject is created
Check product association
Confirm "Enable metafield detection" setting
Ensure all required fields are filled
Content Not Updating?
Clear theme cache
Check metaobject is published
Verify product association
Pro Tip: Create your metaobject first to establish your content structure before creating multiple versions.
Last updated