What Hreflang Tags Are and Why Your Shopify Store Needs Them
Close to 75% of websites with international content have hreflang implementation errors, according to Search Engine Journal's analysis of common hreflang mistakes. That statistic matters because broken hreflang tags don't just underperform — they actively hurt your rankings by creating duplicate content signals across language and region variants.
Hreflang tags are HTML attributes that tell search engines which version of a page to serve based on a user's language and geographic location. If your Shopify store targets customers in the US, UK, Germany, and France, hreflang tags ensure Google shows the right version to each audience instead of treating your four nearly-identical pages as duplicates competing against each other.
This Shopify international SEO hreflang tags setup guide walks through every implementation method available in 2026, from automatic Shopify Markets generation to manual Liquid code for advanced configurations. Whether you're running a single Shopify store with subfolders or a multi-store setup across domains, you'll have a working implementation by the end. For merchants still building their international markets strategy, hreflang is the technical foundation that makes everything else — translated content, localized pricing, regional marketing — actually visible in search results.
How Hreflang Tags Work in International SEO
Before diving into Shopify-specific implementation, understanding the mechanics prevents costly misconfigurations down the line.
The Anatomy of an Hreflang Tag
An hreflang tag lives in the <head> section of your HTML and follows this format:
<link rel="alternate" hreflang="en-us" href="https://example.com/products/widget" />
<link rel="alternate" hreflang="en-gb" href="https://example.com/en-gb/products/widget" />
<link rel="alternate" hreflang="de" href="https://example.com/de/products/widget" />
<link rel="alternate" hreflang="x-default" href="https://example.com/products/widget" />Each tag contains two critical pieces of information:
- `hreflang` value — a language code (ISO 639-1) optionally combined with a country code (ISO 3166-1 Alpha-2)
- `href` value — the fully qualified URL for that language/region version
Language-Only vs Language-Region Codes
| Code | Meaning | When to Use |
|---|---|---|
| en | English (any region) | One English version for all English speakers |
| en-us | English (United States) | Different English content for US vs UK |
| en-gb | English (United Kingdom) | Different pricing, spelling, or regulations |
| de | German (any region) | One German version globally |
| de-at | German (Austria) | Different German content for Austria vs Germany |
Use language-only codes when your content is the same across all countries speaking that language. Add the region code when you have distinct content, pricing, or currency for specific countries.
The x-default Tag
The x-default tag designates your fallback page — the version Google should show when no other hreflang tag matches the user's language or location. Every hreflang implementation should include one. Typically, this points to your primary market version (usually English US or your store's default language).
Reciprocal Requirement
Hreflang tags must be reciprocal. If page A declares page B as its German alternate, page B must also declare page A as its English alternate. Non-reciprocal tags are the single most common implementation error, and Google ignores the entire hreflang set when reciprocity breaks.
Shopify's Automatic Hreflang Generation
Shopify has improved its automatic hreflang handling significantly since the launch of Shopify Markets. Understanding what Shopify does automatically helps you identify what you need to configure manually.
When Shopify Generates Hreflang Tags Automatically
According to Shopify's official hreflang documentation, hreflang tags are automatically created when you:
- Set up international subfolders through Shopify Markets (e.g.,
/fr/,/de/,/en-gb/) - Configure international domains or subdomains (e.g.,
store.de,uk.store.com) - Publish languages through Shopify's translation system
The automatic tags appear on all indexable page types: homepage, product pages, collection pages, blog posts, and standalone pages.
What Automatic Generation Gets Right
Shopify's automatic system handles:
- Correct ISO language and country code formatting
- Self-referencing tags on each page variant
- Reciprocal declarations across all language/region versions
- The
x-defaulttag pointing to your primary market
Where Automatic Generation Falls Short
The automatic system has limitations:
- Multi-store setups — if you run separate Shopify stores for different regions (e.g., one US store and one EU store on different domains), Shopify cannot generate cross-store hreflang tags
- Custom landing pages — pages created through apps or custom sections may not receive automatic hreflang tags
- Partial translations — if only some pages are translated, the hreflang tags still generate for all pages, potentially pointing to untranslated content
- Third-party domains — using a CDN or custom domain routing can break the automatic tag generation
Setting Up Hreflang Tags with Shopify Markets Subfolders
The subfolder approach is the most common and SEO-friendly method for Shopify international stores. Here's how to implement it correctly.
Step 1: Configure Markets and Languages
Navigate to Settings → Markets in your Shopify admin:
- Create a market for each target region (e.g., "France," "Germany," "United Kingdom")
- Assign countries to each market
- Under each market, click Manage and enable the languages you want to offer
- Choose subfolder as your URL structure (e.g.,
yourstore.com/fr/)
Step 2: Publish Languages
Go to Settings → Languages and add the languages you need:
- Click Add language and select from the list
- Install Shopify Translate & Adapt or a third-party translation app like Weglot or Langify
- Translate your content (product descriptions, collection pages, navigation)
- Click Publish for each language when translations are ready
Step 3: Verify Automatic Hreflang Output
After configuring markets and publishing languages, verify the hreflang tags are generating correctly:
- Visit your store's homepage and view the page source (right-click → View Page Source)
- Search for
hreflangin the source code - Confirm each language/region combination has a tag
- Verify the
x-defaulttag is present
You should see something like:
<link rel="alternate" hreflang="en" href="https://yourstore.com/" />
<link rel="alternate" hreflang="fr" href="https://yourstore.com/fr/" />
<link rel="alternate" hreflang="de" href="https://yourstore.com/de/" />
<link rel="alternate" hreflang="x-default" href="https://yourstore.com/" />Step 4: Repeat Verification on Key Page Types
Check hreflang tags on at least one page of each type:
- Homepage
- Product page
- Collection page
- Blog article
- Standalone page (e.g., About, Contact)
If any page type is missing hreflang tags, it's likely a theme issue that requires manual intervention.
Manual Hreflang Implementation with Liquid Code
When Shopify's automatic generation doesn't cover your setup — multi-store configurations, custom pages, or non-standard domain structures — you'll need to add hreflang tags manually through Liquid code in your theme.
Adding Hreflang Tags to theme.liquid
The most common manual approach uses Shopify's Liquid templating to dynamically generate hreflang tags. According to Codersy's guide to dynamic hreflang tags in Shopify Plus, you should add the following to your theme.liquid file in the <head> section:
{%- if request.host != blank -%}
{%- for locale in shop.published_locales -%}
{%- if locale.primary -%}
<link rel="alternate" hreflang="x-default" href="{{ canonical_url | replace: request.path, locale.root_url | append: request.path }}" />
{%- endif -%}
<link rel="alternate" hreflang="{{ locale.iso_code }}" href="{{ canonical_url | replace: request.path, locale.root_url | append: request.path }}" />
{%- endfor -%}
{%- endif -%}Implementation steps:
- Go to Online Store → Themes → Edit code
- Open
Layout/theme.liquid - Find the
<head>section - Paste the Liquid code before the closing
</head>tag - Save and test
Handling Multi-Store Hreflang Tags
If you run separate Shopify stores for different regions (common for merchants needing completely different product catalogs per market), you'll need hardcoded hreflang tags since Liquid can't reference other stores:
<link rel="alternate" hreflang="en-us" href="https://us.yourstore.com{{ request.path }}" />
<link rel="alternate" hreflang="en-gb" href="https://uk.yourstore.com{{ request.path }}" />
<link rel="alternate" hreflang="de" href="https://de.yourstore.com{{ request.path }}" />
<link rel="alternate" hreflang="x-default" href="https://us.yourstore.com{{ request.path }}" />The challenge with hardcoded tags is maintaining URL parity across stores. Every product, collection, and page must have the same slug across all stores, or the hreflang tags will point to 404 pages.
Using Shopify Metafields for Advanced Configurations
For stores needing per-page hreflang customization (e.g., some products only available in certain regions), you can use metafields:
- Create a metafield for pages/products called
seo.hreflang_overrides - Store JSON data mapping language codes to URLs
- Reference the metafield in your theme.liquid to conditionally output hreflang tags
This approach is complex but gives you granular control over which pages declare which alternates.
Hreflang Implementation with International Domains
Some merchants prefer separate domains (e.g., store.de, store.co.uk) over subfolders. This approach has SEO implications specific to Shopify.
Domain Setup in Shopify Markets
To configure international domains:
- Purchase or transfer the domain to Shopify (or point DNS from your registrar)
- In Settings → Markets, assign the domain to the relevant market
- Shopify will generate hreflang tags across all connected domains automatically
SEO Trade-offs: Domains vs Subfolders
| Factor | Subfolders (/fr/) | Separate Domains (.fr) |
|---|---|---|
| Domain authority | Shared (inherits from root domain) | Separate (each domain builds independently) |
| Setup complexity | Low | Medium-high |
| Hreflang management | Automatic via Shopify | Automatic if configured in Markets |
| Content management | Single store | Can be single store with Markets |
| Local SEO signals | Moderate | Strong (ccTLD signals) |
| Cost | Included | Additional domain registration fees |
| Backlink consolidation | All links benefit one domain | Links split across domains |
For most Shopify merchants, subfolders are the recommended approach because they consolidate domain authority and are easier to manage. Country-code domains (ccTLDs) make sense primarily when you need strong local SEO signals in markets where Google weights ccTLDs heavily, or when regulatory requirements mandate a local domain.
Common Hreflang Mistakes That Destroy International Rankings
The high error rate in hreflang implementations isn't because the concept is complex — it's because the details are unforgiving. Here are the mistakes that cost merchants the most traffic.
Mistake 1: Wrong Language or Country Codes
Using en-uk instead of en-gb is one of the most common errors, as noted in Search Engine Land's guide to hreflang. The country code for the United Kingdom is GB (from Great Britain), not UK. Similarly, using three-letter codes like eng instead of the two-letter ISO 639-1 code en invalidates the tag entirely.
| Wrong Code | Correct Code | Error |
|---|---|---|
| en-uk | en-gb | Wrong country code |
| eng-us | en-us | Three-letter language code |
| zh-hans | zh-Hans | Wrong script subtag format |
| pt-br | pt-BR | Country code must be uppercase |
| en_us | en-us | Underscore instead of hyphen |
Mistake 2: Missing Self-Referencing Tags
Every page must include an hreflang tag pointing to itself. If your English US page declares French and German alternates but doesn't include its own en-us tag, Google may not process the entire set. Research shows that 96% of hreflang errors involve missing self-referencing tags.
Mistake 3: Canonical and Hreflang Conflicts
This is the most technically confusing error. Each localized page should have a canonical tag pointing to itself — not to the primary language version. If your French page's canonical tag points to the English page, you're telling Google "this French page is a duplicate of the English page" while simultaneously telling it "this is the French alternate." Google resolves the conflict by ignoring the hreflang, as explained in Genova Web Art's guide to canonical and hreflang for international SEO.
Correct implementation:
<!-- On the French page /fr/products/widget -->
<link rel="canonical" href="https://yourstore.com/fr/products/widget" />
<link rel="alternate" hreflang="en" href="https://yourstore.com/products/widget" />
<link rel="alternate" hreflang="fr" href="https://yourstore.com/fr/products/widget" />
<link rel="alternate" hreflang="x-default" href="https://yourstore.com/products/widget" />Mistake 4: Forgetting x-default
Without an x-default tag, users from countries you haven't explicitly targeted may see a random language version. The x-default serves as your safety net, ensuring everyone gets a reasonable default experience.
Mistake 5: Non-Reciprocal Tags
If your English page declares a French alternate but your French page doesn't declare the English page back, Google ignores both. This often happens when:
- You add a new language but forget to update existing pages
- One store in a multi-store setup updates hreflang tags but the other doesn't
- A theme update overwrites custom hreflang code
| Mistake | Impact | Detection Method |
|---|---|---|
| Wrong language/country codes | Tags completely ignored | Hreflang tag validator tools |
| Missing self-referencing tags | Entire hreflang set may be ignored | View page source and check |
| Canonical-hreflang conflicts | Google ignores hreflang, follows canonical | Google Search Console coverage report |
| Missing x-default | Users from unmatched regions see wrong version | Manual source code review |
| Non-reciprocal tags | Both pages' hreflang sets ignored | Crawl both pages and cross-reference |
Validating Your Hreflang Implementation
Implementing hreflang tags without validation is like shipping code without testing. Use these tools and methods to confirm everything works.
Google Search Console Validation
Google Search Console provides the most authoritative feedback on your hreflang implementation:
- Register each market version as a separate property in Google Search Console (e.g.,
yourstore.com/fr/as a directory property) - Check the International targeting section under Legacy tools
- Monitor the Coverage report for hreflang-related errors
- Review the URL inspection tool for individual pages to see which hreflang tags Google detected
Third-Party Validation Tools
Several tools can crawl your site and identify hreflang errors:
- Screaming Frog — crawls your site and maps all hreflang tags, flagging errors in reciprocity, missing tags, and incorrect codes
- Ahrefs Site Audit — includes hreflang validation as part of its international SEO checks
- Hreflang Tags Testing Tool by Merkle — free online tool for checking individual page hreflang declarations
- SEMrush Site Audit — flags hreflang implementation issues across your entire site
For a comprehensive view of your store's technical SEO health, including hreflang validation, use Talk Shop's SEO audit tool to get an automated analysis of your international SEO setup.
Manual Validation Checklist
Run through this checklist for each market version of your key pages:
- Self-referencing hreflang tag present
- All alternate versions declared
- Reciprocal tags confirmed on all alternates
- x-default tag present
- Language and country codes follow ISO standards
- Canonical tag points to self (not primary version)
- URL in hreflang matches the actual page URL exactly (including trailing slash)
- No redirect between the declared URL and the live page
Hreflang Tags in Shopify XML Sitemaps
In addition to HTML <link> tags, you can declare hreflang relationships in your XML sitemap. Shopify generates sitemaps automatically, but understanding the structure helps with troubleshooting.
How Shopify Handles Sitemap Hreflang
When you have multiple languages configured through Shopify Markets, Shopify includes hreflang annotations in the sitemap using the xhtml:link namespace:
<url>
<loc>https://yourstore.com/products/widget</loc>
<xhtml:link rel="alternate" hreflang="en" href="https://yourstore.com/products/widget" />
<xhtml:link rel="alternate" hreflang="fr" href="https://yourstore.com/fr/products/widget" />
<xhtml:link rel="alternate" hreflang="de" href="https://yourstore.com/de/products/widget" />
<xhtml:link rel="alternate" hreflang="x-default" href="https://yourstore.com/products/widget" />
</url>Sitemap vs HTML Hreflang: Which Takes Priority?
Google processes hreflang declarations from both sitemaps and HTML <link> tags. If they conflict, Google typically gives preference to the HTML version. Best practice is to ensure both sources agree. Inconsistencies between sitemap and HTML hreflang declarations are a common source of errors that go unnoticed because most merchants only check one location.
Submitting Sitemaps for Each Market
Submit your sitemap to Google Search Console for each property:
- Access each market's Search Console property
- Go to Sitemaps in the left navigation
- Submit the sitemap URL (usually
yourstore.com/sitemap.xml) - Monitor indexing status for each language version separately
Advanced Hreflang Strategies for Shopify Plus
Shopify Plus merchants have access to additional customization options that enable more sophisticated hreflang implementations.
Checkout Localization and Hreflang
Shopify Plus allows checkout customization, which means localized checkout pages also need hreflang consideration. While Google doesn't typically index checkout pages, ensuring your cart and pre-checkout pages have proper hreflang tags prevents users from being bounced to the wrong language version during the purchase flow.
Using Shopify Functions for Dynamic Hreflang
Shopify Functions can extend your hreflang logic for complex scenarios:
- Market-specific product availability — only generate hreflang tags for products available in each market
- Seasonal content — adjust hreflang tags for time-zone-specific landing pages
- A/B testing — maintain proper hreflang during international A/B tests
Integrating with Headless Storefronts
If you're running a headless Shopify setup using Hydrogen or a custom frontend, hreflang tags won't be generated automatically. You'll need to:
- Query the Storefront API for available locales
- Build hreflang tags dynamically in your frontend framework
- Include them in the SSR (server-side rendered) HTML head
- Maintain the same reciprocal and self-referencing requirements
For a deeper understanding of Shopify SEO fundamentals that apply to both standard and headless setups, our comprehensive checklist covers the technical foundations you need.
Monitoring Hreflang Performance After Launch
Implementing hreflang tags is step one. Monitoring their impact on international traffic and rankings is where the value materializes.
Key Metrics to Track
Monitor these metrics in Google Analytics and Search Console, segmented by market:
- Impressions by country — are you appearing in the intended markets?
- Click-through rate by language — is the correct language version showing in SERPs?
- Organic traffic by subfolder/domain — is each market version receiving traffic?
- Ranking position by market — are you ranking in the right country's search results?
- Indexation rate by language — is Google indexing all your language versions?
Red Flags That Indicate Hreflang Problems
Watch for these signals that something is wrong:
- Traffic from the wrong country to a language version (e.g., German users landing on the French version)
- Duplicate content warnings in Search Console for pages that should be language alternates
- Sudden traffic drops in one market after a theme update (hreflang tags may have been overwritten)
- "Alternate page with proper canonical tag" errors in Search Console's coverage report
- Crawled but not indexed status for language versions that should be indexed
Regular Audit Schedule
| Frequency | Action |
|---|---|
| Weekly | Check Search Console for new hreflang errors |
| Monthly | Crawl site with Screaming Frog and verify hreflang completeness |
| Quarterly | Full international SEO audit including rankings by market |
| After theme updates | Immediately verify hreflang tags weren't overwritten |
| After adding new markets | Confirm new tags are reciprocal with all existing markets |
Implementing structured data alongside hreflang tags further strengthens your international SEO by giving search engines additional context about your content's language and regional targeting.
Frequently Asked Questions
Do hreflang tags affect page speed?
Minimally. Each hreflang tag adds roughly 100-150 bytes to your HTML. Even with 10 language versions, that's about 1.5KB — negligible compared to images, scripts, or stylesheets. The SEO benefit far outweighs any performance impact.
Should I use hreflang tags if I only have one language but sell to multiple countries?
Yes. If you have different pricing, currency, or content for the US vs the UK (both English), use en-us and en-gb hreflang tags to tell Google which version to show in each country. Language doesn't have to differ — regional targeting is equally valid.
What if some products aren't available in all markets?
For products only available in certain markets, you have two options: (1) generate hreflang tags only for markets where the product is available, or (2) generate hreflang tags for all markets but show a "not available in your region" message on unavailable products. Option 1 is cleaner for SEO, but Option 2 provides a better user experience since the customer at least sees the product exists.
How long does it take for hreflang tags to take effect?
Google needs to crawl and process all language versions before hreflang takes effect. For a typical Shopify store, expect 2-4 weeks for initial recognition and 1-3 months for full impact on international rankings. You can accelerate this by submitting updated sitemaps and using the URL Inspection tool to request re-indexing.
Can incorrect hreflang tags cause a penalty?
Incorrect hreflang tags don't trigger a manual penalty. However, broken implementations can cause Google to treat your language versions as duplicate content, which suppresses rankings for all versions. The effect is the same as a penalty even though it's technically an algorithmic response.
Hreflang tags are one of those technical SEO elements that seem straightforward on paper but trip up the majority of implementations in practice. The merchants who get it right gain a significant competitive advantage in international search — their pages appear in the correct markets, their duplicate content issues disappear, and their international organic traffic grows predictably. Start with Shopify's automatic generation, validate thoroughly, and layer in manual customizations only where the automatic system falls short. For ongoing technical SEO monitoring across all your international storefronts, the Talk Shop community is a resource worth bookmarking.
About Talk Shop
The Talk Shop team — insights from our community of Shopify developers, merchants, and experts.
Related Insights
The ecommerce newsletter that's actually useful.
Daily trends, teardowns, and tactics from the top 1% of ecommerce brands. Delivered every morning.