D. Adding a section for product instructions

Goal

Show a newly added section under the Product Global Images which outputs steps with their associated images to act as Product Guides.

How it decides what to show

1. Look at the selected product.
   If that product has a list of entries in product_guides, show those cards.

What you create in the Shopify admin

Do these steps once, if not already created

1. Make the metaobject type
   • Content → Metaobjects → Add type
   • Name: product_guides
   • Fields
   Title as single line text, Image as a file and Description as rich text

2. Add metafield definitions for Products
   • Settings → Custom data → Products → Add definition
   • Name: Guides Image
   • Type: List of metaobjects → Guides Image
   • Namespace and key: product_guides.image
   
   

Add the content

You will do this whenever you need new guides to add to products. You already have a list of entries currently used mostly for the Moss Poles.

1. Create the cards
   • Content → Metaobjects → Product Guides → Add entry
   • Fill Image, Title and Description
   • Save
   • Repeat for every card you want

2. Attach the cards to a product by selecting each entry in the product metafield and saving this.

Place the block in your theme

1. Online Store → Customize

2. Open your product template

3. Add a new section called Multi Column. attach the Product MetaObject to it.

4. Save

Common mistakes and how to fix them

• Nothing shows at all
Check the section was added to the correct product template in which you saved the new section.

• Keys do not match
Confirm these exact keys
product_guides.image
product_guides.description_
product_guides.title

• Cards created but not visible
On the product attach the Product Guide entries inside the correct metafield. Creating the metaobject entry is not enough. You must also link it.