Help with markets subdomains and connecting to hydrogen

Retired Boards Appdev Custom Storefronts
,

Topic summary

Issue: After migrating to Hydrogen (Shopify’s custom storefront framework), Markets subdomains for non-primary regions (e.g., UK/EU/NZ) still redirect to the Liquid (Online Store) theme, despite targeting Hydrogen.

Hybrid goal: Run primary and some markets on Liquid while moving select markets (e.g., NL) to Hydrogen to de-risk a full switch. Even with the domain target set to Hydrogen, the subdomain continued pointing to Liquid.

Workaround (reported by a participant):

  • Shopify Markets > Select Market > Domains and languages: set Market domain to “Primary Domain Only”.
  • Settings > Domains > Select the subdomain: set Target to the Hydrogen production deployment.
  • Change Domain Type to “Alias domain”.
    Result: Market-specific subdomains serve Hydrogen.

Locale handling: In Hydrogen, derive market/language from the request host. A code snippet and Shopify docs link were shared; this is central to correct market/language behavior.

Status/next steps: A Shopify staff member noted they’re working to make this more seamless and will update documentation. Thread has a workable solution; no official permanent fix yet. A separate question about running builds on GCP/AWS remains unaddressed.

Summarized with AI on January 21. AI used: gpt-5.
6

@jennvelez @SBD
So a possible solution is to work with alias domains:

  1. Go to Shopify Markets > Select Market > Domains and languages
  2. Set Market domain to “Primary Domain Only”
  3. Go to Settings > Domains > Select your subdomain
  4. Change “Target” to your Hydrogen deployment
  5. Change “Domain Type” to “Alias domain”

At this point accessing your market specific subdomain should show your Hydrogen storefront. To get correct market/language setting and fetch the market specific data in your shop you can do the following:

In your Hydrogen code you’ll derive market and language from your domain, see the link here: https://shopify.dev/docs/custom-storefronts/hydrogen/markets/multiple-languages-domains#step-1-create-a-utility-that-reads-requested-host

export function getLocaleFromRequest(request: Request): Locale {
  // Get the user request URL
  const url = new URL(request.url);

  // Match the URL host
  switch (url.host) {
    case 'ca.hydrogen.shop':
      return {
        language: 'EN',
        country: 'CA',
      };
      break;
    case 'hydrogen.fr':
      return {
        language: 'FR',
        country: 'CA',
      };
      break;
    default:
      return {
        language: 'EN',
        country: 'US',
      };
  }
}