How can I fully customize a Hydrogen site using a custom theme?

Topic summary

Goal: port an existing Shopify store to Hydrogen (Shopify’s React-based framework) to gain customization while keeping content like images, menus, and text editable.

Key questions: whether to build a new custom theme from scratch or reuse parts of the existing theme; how much of a theme is accessible via GraphQL. Main menu links can be fetched, but components like an image carousel and highlights banner lack clear identifiers retrievable through GraphQL.

Approach considered: use a theme as a “database” to drive a customizable Hydrogen site. Concern: losing the Theme Editor’s live preview if moving away from a standard Online Store theme.

Latest update: no helpful guidance received. The implementation proceeded with significantly reduced customization compared to the original goal.

Status: unresolved/ongoing. Open issues include the extent of GraphQL coverage for theme sections/blocks and strategies to preserve editor preview capabilities within a Hydrogen-based workflow.

Summarized with AI on February 5. AI used: gpt-5.

Hey everyone, looking for some guidance.
I’ve been tasked with porting over our Shopify website to the new Hydrogen framework for the increased customization options it offers. However, we also want the Hydrogen site to be fully customizable (images, menus, text, etc, not necessarily formatting).

I understand the fundamentals of setting up the Hydrogen store and getting store data using GraphQL, but am a bit hung up on the customization options. Would it be best to develop a new theme from scratch in order to accomplish what I’m trying to do, or to just grab elements from our existing theme and port them to the new Hydrogen site? Is every aspect of the theme accessible through GraphQL? For instance, I am definitely able to grab the main-menu links and map those to the new site, but aspects like the image carousel and the highlights banner don’t seem to have a set label that I’m able to grab through GraphQL.

It seems like developing my own theme as just a sort of database in order to create a customizable Hydrogen site is the best option, but I’m assuming I lose the Live preview on the theme editor if I attempt to do so.

Any assistance to help me wrap my head around all this would be helpful. Thanks for reading!

1 Like

Curious if you found any help with this.. Thanks

Unfortunately no, I’ve just ended up making it not nearly as customizable as I wanted to.