Have your say in Community Polls: What was/is your greatest motivation to start your own business?
Our Partner & Developer boards on the community are moving to a brand new home: the .dev community forums! While you can still access past discussions here, for all your future app and storefront building questions, head over to the new forums.

Re: Switch Shopify theme-builder front-end to Hydrogen/Oxygen Build

Switch Shopify theme-builder front-end to Hydrogen/Oxygen Build

dougtech
Shopify Partner
2 0 1

I can't seem to find any documentation or clear instructions on how I switch my newly created Hydrogen app hosted on Oxygen over to be the main front-end build for my Shopify store. How do I properly switch off the base themed Shopify store and switch on my custom Hydrogen build?

Replies 2 (2)

dbuggger
Tourist
3 0 1

Switching your Shopify store's front-end to your new Hydrogen app on Oxygen involves a few key steps, but I'll break it down simply:

 

Get Your Hydrogen App Ready:
First, make sure your Hydrogen app is fully set up and running on Oxygen. Test it to ensure everything works as expected.


Link Your Domain to the Hydrogen App:
In Shopify, go to the Domains section under Online Store.
Add your custom domain (like your store url) if you haven't already.
Update the DNS settings so that this domain points to your Hydrogen app hosted on Oxygen.


Redirect Traffic to Your Hydrogen App:
In Shopify's admin panel, go to Online Store > Preferences.
Look for a section called Custom storefront and enter the URL where your Hydrogen app is hosted.
This step tells Shopify to direct all customer traffic to your new Hydrogen app instead of the old Shopify theme.


Minimize the Shopify Theme (Optional) :
While you can't completely turn off the old Shopify theme, you can make it less visible:
Either keep a very simple placeholder theme active, or let Shopify still hold the theme in the background while your Hydrogen app handles the main customer-facing experience.


Test Everything:
Visit your store's domain to make sure it now shows your Hydrogen app instead of the old theme.
Check that everything, like navigation and checkout, works smoothly.


Keep an Eye on Performance:
Once your Hydrogen app is live, monitor how it performs and be ready to make adjustments if needed.

dougtech
Shopify Partner
2 0 1

Thanks!!