Hydrogen Customization Guide
A complete reference for managing your storefront sections through Shopify Metaobjects. Expand any section below to view step-by-step instructions and screenshots.
Sections You Can Customize
01Home Banner
▾Applies to section:
Steps
01Click on the Home Banner metaobject
02Open the desired entry
03Update the required fields
04Click Save
View Screenshot
02Review
▾Applies to section:
Steps
01Click on the Review metaobject
02Open the entry
03Update the required fields
04Click Save
View Screenshot
03Location
▾Applies to section:
Steps
01Click on Location metaobject
02Open the entry
03Update the required fields
04Click Save
View Screenshot
04InstagramLinked
▾Applies to section:
Important — Connected Metaobjects
This section works using two connected metaobjects:
MainInstagram
ItemsInstagram Slider
How It Works
Inside the Instagram metaobject, there is a Content field. This field contains multiple Instagram Slider entries (shown as small items in the list).
Steps
01Click on the Instagram metaobject
02Open the entry
03Scroll to the Content field
04Click on any item inside the Content list (these are Instagram Slider entries)
05Make the required changes
06Click Save
Instagram
Instagram Slider
05Story CraftLinked
▾Applies to section:
Important — Connected Metaobjects
This section works using two connected metaobjects:
MainStory Craft Parent
ItemsStory Craft Item
How It Works
Inside the Story Craft Parent metaobject, there is a field Story Craft Item. This field contains Story Craft Item entries. Each item represents one story block.
Steps
01Click on the Story Craft Parent metaobject
02Open the entry
03Find the linked Story Craft Item list
04Click on any item from the list
05Make the required changes
06Click Save
Story Craft Parent
Story Craft Item
06Split Banner SplitedLinked
▾Applies to section:
Important — Connected Metaobjects
This section works using two connected metaobjects:
MainSplit Banner Splited
ItemsSplit Banner List
How It Works
Inside the Split Banner Splited metaobject, there is a field Split Banner List. This field contains multiple Split Banner List entries.
Steps
01Click on the Split Banner Splited metaobject
02Open the entry
03Find the linked Split Banner List
04Click on any item from the list
05Make the required changes
06Click Save
Split Banner Splited
Split Banner List
07Initiatives SplitedLinked
▾Applies to section:
Important — Connected Metaobjects
This section works using two connected metaobjects:
MainInitiatives Splited
ItemsInitiatives Splited List
How It Works
Inside the Initiatives Splited metaobject, there is a field Initiatives Splited List. This field contains multiple Initiatives Splited List entries.
Steps
01Click on the Initiatives Splited metaobject
02Open the entry
03Find the linked Initiatives Splited List
04Click on any item from the list
05Make the required changes
06Click Save
Initiatives Splited
Initiatives Splited List
08Gemstone Guidance Splited
▾Applies to section:
Steps
01Click on Gemstone Guidance Splited metaobject
02Open the entry
03Update the required fields
04Click Save
View Screenshot
09Ring Collections Splited
▾Applies to section:
Steps
01Click on Ring Collections Splited metaobject
02Open the entry
03Update the required fields
04Click Save
View Screenshot
10Collection or Product HeadingLinked
▾Applies to section:
Important — Connected Metaobjects
This section works using two connected metaobjects:
MainCollection or Product Heading
ItemsCollection or Product Slider
How It Works
Inside the Collection or Product Heading metaobject, there is a field Collection or Product Slider. This field contains multiple Collection or Product Slider entries.
Steps
01Click on the Collection or Product Heading metaobject
02Open the entry
03Find the linked Collection or Product Slider
04Click on any item from the list
05Make the required changes
06Click Save
Collection or Product Heading
Collection or Product Slider
11FAQ
▾Applies to section:
Steps
01Click on FAQ metaobject
02Open the entry
03Update the required fields
04Click Save
View Screenshot
12Diamond CollectionLinked
▾Applies to section:
Important — Connected Metaobjects
This section works using two connected metaobjects:
MainDiamond Collection
ItemsCollection List
How It Works
Inside the Diamond Collection metaobject, there is a field Collection List. This field contains multiple Collection List entries.
Steps
01Click on the Diamond Collection metaobject
02Open the entry
03Find the linked Collection List
04Click on any item from the list
05Make the required changes
06Click Save
Diamond Collection
Collection List
Product You Can Customize
01Variant Media
▾Applies to section:
Add variant-specific gallery media so selected variants can show extra images or videos in the product media carousel.
Steps
01Open the product in Shopify Admin.
02Select the variant you want to customize.
03In the variant metafields section, add custom.variant_media.
04Attach one or more media references (images or videos).
05Save the variant and refresh the product page.
View Screenshot
02Engraving Preview
▾Applies to section:
Use this metafield to set the engraving preview image for a variant on products tagged ENGAGEMENT RINGS.
Steps
01Open the product in Shopify Admin.
02Add the product tag ENGAGEMENT RINGS.
03Select the variant you want to customize.
04In the variant metafields section, add custom.engraving_preview.
05Upload or select an engraving preview image reference.
06Save the variant, refresh the product page, and enter engraving text.
View Screenshot
03Detail Info
▾Applies to section:
Use this metafield to set the product detail information that appears in the Details tab on the product page.
Steps
01Open the product in Shopify Admin.
02In the product metafields section, add custom. detail info.
03add Detail information in the text field.
04Save the product
View Screenshot
