How can I progressively migrate from my online store to Hydrogen?

Store Design
1

How can I progressively migrate from my online store to Hydrogen?

Suppose my old online store at https://online.store has the following routed pages:

/
/search
/collections/*
/*/collections/*

/products/*
/*/products/*

/blogs/*
/*/blogs/*

/checkouts/
/checkout

/account
/orders
/carts
/cart

/policies/
/*/policies/

I have created a new store using Shopify Hydrogen and have deployed it to Oxygen at https://hydrogen.store. Currently, this store has the following pages:

/
/search
/collections/*
/*/collections/*

I now want to replace some pages of the old online store with Hydrogen pages, for example:

https://online.store/  => https://hydrogen.store/
https://online.store/search  => https://hydrogen.store/search
https://online.store/collections/*  => https://hydrogen.store/collections/*
https://online.store/*/collections/*  => https://hydrogen.store/*/collections/*

How can I achieve this goal?

  • How do I set up the old online store to redirect pages to the Hydrogen pages?
  • How do I maintain the SEO ranking and traffic of the old online store?
  • How do I analyze the effects of the migration afterward, such as SEO ranking, traffic, conversion rates, etc.?
2

Hi @liaoyi

Understand the goal

You’re not migrating the entire site at once — instead, you’re selectively routing traffic for specific URLs from your old online store (Liquid storefront) to your new Hydrogen app (Oxygen-hosted site).

For example:

https://online.store/collections/*   →   https://hydrogen.store/collections/*

This approach lets you gradually test Hydrogen performance and functionality while keeping core checkout and account pages on your main store.

Set up redirects from your Online Store to Hydrogen

Shopify’s Liquid storefront doesn’t allow dynamic redirects via Liquid, but you can use one of the following approaches:

Option A: Use Shopify’s “URL Redirects” feature

If your routes are few or static:

  1. Go to Shopify Admin → Online Store → Navigation → View URL redirects.
  2. Click Create URL redirect.
  3. Enter:
  • Redirect from: /collections/shoes
  • Redirect to: https://hydrogen.store/collections/shoes
  1. Repeat for other static pages.

Pros: Simple, no coding
Cons: Not scalable for wildcard routes like /collections/*

Option B: Use a proxy app or Cloudflare

If you need dynamic/wildcard routing:

Using Cloudflare (recommended)
If your DNS is managed on Cloudflare (or similar CDN), set up redirect rules:

Example Cloudflare rule:

If URL path matches /collections/*
Then Forwarding URL (302 or 301 permanent redirect) to https://hydrogen.store/collections/$1

This handles wildcard paths and keeps SEO-friendly redirects.

Pros: Works for entire URL patterns
Cons: Requires DNS-level access

Option C: Use a custom reverse proxy (advanced)

You can configure a reverse proxy to serve Hydrogen pages under your main domain — e.g.
https://online.store/collections/* proxies requests directly to https://hydrogen.store/collections/*.

This setup requires:

  • A CDN or edge worker (Cloudflare Workers, Fastly, Akamai, etc.)
  • Proper handling of cookies and Shopify session tokens

Maintain SEO and traffic

To avoid SEO loss:

  • Use 301 (permanent) redirects for SEO continuity.
  • Add canonical tags on Hydrogen pages pointing to their new URLs.
  • Keep sitemap.xml updated (either merged or Hydrogen-only).
  • Maintain identical meta titles, meta descriptions, and OpenGraph tags on Hydrogen pages.
  • Make sure to set up Google Search Console for both domains and monitor crawl/index coverage.

4. Analyze the migration impact

Track performance and ranking differences:

  1. Google Search Console:
  • Add both domains (online.store and hydrogen.store)
  • Monitor impressions, clicks, and average position.
  1. Google Analytics or Shopify Analytics:
  • Compare bounce rate, conversion rate, and average session duration before/after redirect.
  1. Hydrogen monitoring tools:
  • Use Shopify Oxygen logs + Vercel/Cloudflare analytics to monitor route load times and traffic.
  1. A/B testing (optional):
  • Temporarily route a % of traffic to Hydrogen pages to measure performance before full migration.

Gradually expand routes

Once you’re satisfied with the initial routes, expand the redirect coverage:

  • /products/*
  • /blogs/*
  • /policies/*

Keep /cart, /checkout, and /account on the Online Store until Hydrogen supports full checkout flow via Storefront API.

Best regards,
Devcoder :laptop:

3

I’m sorry, but the solutions you provided seem to be very common ones suggested by AI, and none of them can conveniently meet my actual needs.

  1. Using Shopify’s URL Redirects feature

I gave it a try and found that the links set up below cannot redirect correctly:

/collections/all > https://hydrogen.store/collections/all
/blogs/news > https://hydrogen.store//blogs/reviews
/pages/contact > https://hydrogen.store/pages/contact

Reasons:

  1. /collections/all is a reserved path. Shopify does not allow redirects for the following fixed paths: /products, /collections, /collections/all. These are URL paths reserved by the Shopify system and cannot be redirected.

  2. /blogs/news and /pages/contact are not “broken URLs”. Shopify’s redirects only work from URLs that are broken (i.e., URLs that display a 404 error or “page not found”). If these URLs still load valid web pages, the redirect will not take effect.

  3. Using proxy apps or Cloudflare

Limitations:

  1. I cannot provide DNS-level access to the site’s domain name.

  2. As far as I know, SPA site pages of online stores cannot be directly redirected to a Shopify Hydrogen SSR project through this method—it’s not just a matter of setting up redirects!

  3. Using a custom reverse proxy

My project is deployed on Oxygen, not using a self-deployment solution.

So, is there any simpler and more reliable solution other than the three mentioned above?