How to Set Up Hreflang on Shopify
Step-by-step guide to implement hreflang tags on Shopify and Shopify Plus. Avoid duplicate content penalties, rank globally, and signal language versions to Google.
The Problem You're Facing
You've built a Shopify store. You've shipped it to multiple countries or languages. Now Google sees duplicate content across your domains, subfolders, or subdirectories. Your rankings tank. You're losing visibility in markets you actually serve.
Hreflang tags tell Google which version of a page is intended for which audience. Without them, search engines don't know if your English product page is the same as your French one. They might index the wrong version. They might penalize you for duplicates.
Setting up hreflang on Shopify is technical but not impossible. The challenge: Shopify has quirks. Shopify Plus has different constraints. One mistake—a typo in a URL, a missing language code, a broken self-referential tag—and your hreflang setup fails silently. Google ignores it. Your duplicate content problem persists.
This guide walks you through the exact steps. We'll cover Shopify Markets, Shopify Plus, manual implementation, and the pitfalls that break most setups.
Prerequisites: What You Need Before Starting
Before you touch code or Shopify settings, confirm you have these in place:
Your domain structure. Are you using separate domains per market (example.com, example.fr, example.de)? Subfolders (example.com/en/, example.com/fr/)? Subdomains (en.example.com, fr.example.com)? Hreflang implementation changes based on your structure. If you haven't decided yet, subfolders are easiest for Shopify and cleanest for SEO.
A list of all language and region combinations. Document every language-country pair you serve. Use ISO 639-1 codes for language (en, fr, de) and ISO 3166-1 alpha-2 codes for country (US, GB, FR). If you serve English globally, you need an "x-default" tag. Write this down. You'll reference it constantly.
Access to your Shopify theme code. If you're on a custom theme, you need theme editor access. If you're on a pre-built theme, check whether it supports hreflang natively. Many modern themes do; older ones don't.
Google Search Console set up and verified. Before hreflang matters, Google needs to crawl your site. If you haven't verified your domain in Google Search Console yet, follow our step-by-step guide to set up Google Search Console in 10 minutes. You'll need this to monitor hreflang errors later.
A sitemap strategy. Hreflang works best when paired with proper XML sitemaps that include hreflang annotations. Shopify generates sitemaps automatically, but you need to know where they live and how to extend them.
Shopify Markets enabled (if applicable). Shopify Markets is the native way to handle multiple regions and languages. If you're using it, your hreflang setup is simpler. If you're managing multiple Shopify stores or using a third-party app, your setup is more manual.
Understanding Hreflang: The Basics
Hreflang is an HTML tag that lives in the <head> section of a page. It tells search engines: "This page exists in multiple versions. Here's which version is for which audience."
A basic hreflang tag looks like this:
<link rel="alternate" hreflang="en" href="https://example.com/products/shoes" />
<link rel="alternate" hreflang="fr" href="https://example.com/fr/products/shoes" />
<link rel="alternate" hreflang="de" href="https://example.com/de/products/shoes" />
Key rules:
Self-referential tags are required. Every page must reference itself. If you're on the English version, include <link rel="alternate" hreflang="en" href="https://example.com/products/shoes" />.
Use the correct language-region format. Language-only tags like hreflang="en" work for generic English. Language-region tags like hreflang="en-US" or hreflang="en-GB" target specific audiences. Use language-region when you serve the same language in different countries with different products, pricing, or content.
Include x-default for your fallback. If you serve English globally as a catch-all, add <link rel="alternate" hreflang="x-default" href="https://example.com/products/shoes" />. This tells Google: "If none of the other language versions match the user's preference, show this one."
URLs must be absolute and canonical. Never use relative URLs. Never use parameters that shouldn't be there. https://example.com/products/shoes is correct. /products/shoes is not. https://example.com/products/shoes?utm_source=email is wrong.
Hreflang is bidirectional. If the English page links to the French version, the French page must link back to the English version. Missing one direction breaks the entire setup.
Now let's implement this on Shopify.
Step 1: Determine Your Domain Structure
Your domain structure determines how you'll implement hreflang. Shopify supports three approaches.
Separate domains per market. You run example.com for the US, example.fr for France, example.de for Germany. Each domain is a separate Shopify store or a single Shopify Plus store with multiple storefronts.
Hreflang looks like:
<link rel="alternate" hreflang="en-US" href="https://example.com/products/shoes" />
<link rel="alternate" hreflang="fr-FR" href="https://example.fr/products/shoes" />
<link rel="alternate" hreflang="de-DE" href="https://example.de/products/shoes" />
Subfolders. You run example.com/en/, example.com/fr/, example.com/de/. This is the cleanest for Shopify. All markets share one domain. Shopify Markets uses this by default.
Hreflang looks like:
<link rel="alternate" hreflang="en" href="https://example.com/en/products/shoes" />
<link rel="alternate" hreflang="fr" href="https://example.com/fr/products/shoes" />
<link rel="alternate" hreflang="de" href="https://example.com/de/products/shoes" />
Subdomains. You run en.example.com, fr.example.com, de.example.com. This is less common but still valid.
Hreflang looks like:
<link rel="alternate" hreflang="en" href="https://en.example.com/products/shoes" />
<link rel="alternate" hreflang="fr" href="https://fr.example.com/products/shoes" />
<link rel="alternate" hreflang="de" href="https://de.example.com/products/shoes" />
Which should you choose? Subfolders are easiest for Shopify and cleanest for SEO. Domain authority consolidates under one root domain. Shopify Markets handles them natively. Pick subfolders unless you have a specific reason not to.
If you're already live with separate domains, don't panic. You can still implement hreflang. It's just more manual work.
Step 2: Set Up Shopify Markets (Recommended)
If you're on Shopify Plus or a modern Shopify plan with Markets enabled, this is your fastest path to hreflang.
Log into your Shopify admin. Go to Settings > Markets. You should see a list of your active markets.
Verify your market configuration. For each market, check:
- Market name. Should match your target audience (United States, France, Germany).
- Market domains. If using separate domains, each market should have its assigned domain. If using subfolders, Shopify automatically appends the market code.
- Market language. Set the default language for each market. Shopify uses this to determine hreflang language codes.
Check your primary market. This is your fallback. Shopify treats it as the x-default. Make sure it's set to your largest market or your global fallback.
Once Markets are configured, Shopify automatically injects hreflang tags into your theme. You don't need to write code. Shopify does it for you.
Verify the output. Visit a product page on your live store. Right-click and select Inspect. Search for hreflang in the HTML. You should see tags like:
<link rel="alternate" hreflang="en" href="https://example.com/en/products/shoes" />
<link rel="alternate" hreflang="fr" href="https://example.com/fr/products/shoes" />
<link rel="alternate" hreflang="x-default" href="https://example.com/products/shoes" />
If you see them, you're done with this step. Skip to Step 4.
If you don't see them, your theme doesn't support automatic hreflang injection. Move to Step 3.
Step 3: Manually Add Hreflang to Your Theme (If Needed)
If Shopify Markets didn't inject hreflang tags automatically, you need to add them manually to your theme code.
Access your theme code. In Shopify admin, go to Sales Channels > Online Store > Themes. Find your active theme. Click Edit Code.
Open theme.liquid. This is your main template file. It contains the <head> section where hreflang tags belong.
Locate the closing </head> tag. You'll add hreflang code just before it.
Add hreflang logic using Liquid. Shopify uses Liquid, a templating language. Here's the code for subfolders:
{% if request.locale %}
<link rel="alternate" hreflang="{{ request.locale }}" href="{{ request.origin }}{{ request.path }}" />
{% endif %}
{% for locale in shop.locales %}
{% if locale != request.locale %}
<link rel="alternate" hreflang="{{ locale.iso_code }}" href="{{ request.origin }}/{{ locale.iso_code }}{{ request.path_without_locale }}" />
{% endif %}
{% endfor %}
<link rel="alternate" hreflang="x-default" href="{{ request.origin }}{{ request.path_without_locale }}" />
Let's break this down:
request.localegrabs the current page's language.shop.localesloops through all languages you've enabled in Shopify.request.pathis the current URL path.request.path_without_localeremoves the language prefix (e.g.,/en/or/fr/).- The loop generates one hreflang tag per language.
x-defaultpoints to your root domain version as the fallback.
For separate domains, use this instead:
{% assign market_domains = "example.com:en-US,example.fr:fr-FR,example.de:de-DE" | split: "," %}
{% for mapping in market_domains %}
{% assign parts = mapping | split: ":" %}
<link rel="alternate" hreflang="{{ parts[1] }}" href="https://{{ parts[0] }}{{ request.path }}" />
{% endfor %}
<link rel="alternate" hreflang="x-default" href="https://example.com{{ request.path }}" />
This hardcodes your domain-to-language mappings. Update the domains and language codes to match your setup.
Save your changes. Click Save. Shopify deploys the code to your live theme immediately.
Test the output. Visit a product page. Inspect the HTML. Confirm hreflang tags appear and point to the correct URLs.
Step 4: Validate Hreflang in Google Search Console
Once hreflang tags are live, Google needs to see them and validate them. This takes a few days.
Log into Google Search Console. Go to the property for your root domain.
Wait 2-3 days. Google needs time to crawl your site and detect hreflang tags.
Check for hreflang errors. In GSC, go to Indexing > Pages. Filter by "Hreflang errors." If you see errors, Google found issues with your tags.
Common errors:
Invalid hreflang tag. URL is malformed, language code is wrong, or the tag syntax is broken. Check the exact error message. Usually it's a typo.
Hreflang not reciprocal. Page A links to Page B in a different language, but Page B doesn't link back to Page A. This breaks hreflang. Every page must reference every other version.
Self-referential missing. A page doesn't include an hreflang tag pointing to itself. Always include a self-referential tag.
Conflicting hreflang. A page has hreflang tags that contradict each other (e.g., two tags for the same language pointing to different URLs). Remove duplicates.
Fix errors immediately. Even one broken hreflang tag can cause Google to ignore your entire hreflang setup. Review your Liquid code. Test locally. Deploy fixes.
Monitor hreflang coverage. In GSC, go to Enhancements > International Targeting. This shows which pages have hreflang tags and how Google interprets them. Verify that your main pages (home, product pages, collection pages) all have hreflang coverage.
If coverage is low, you might have a theme issue. Check whether hreflang tags are rendering on all page types.
Step 5: Add Hreflang to Your XML Sitemap
Hreflang works in two places: HTML tags and XML sitemaps. Adding hreflang to your sitemap gives Google another signal and helps with discovery.
Shopify generates sitemaps automatically at yourstore.myshopify.com/sitemap.xml. However, this default sitemap doesn't include hreflang annotations.
Option 1: Use Shopify's native sitemap (easiest). If you're on Shopify Plus or have Markets enabled, Shopify automatically generates separate sitemaps per market. You don't need to annotate them. Google will find all versions.
Option 2: Manually annotate your sitemap (for advanced setups). If you're managing multiple domains or using a custom setup, you can create an annotated sitemap.
An annotated sitemap looks like:
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:xhtml="http://www.w3.org/1999/xhtml">
<url>
<loc>https://example.com/en/products/shoes</loc>
<xhtml:link rel="alternate" hreflang="en" href="https://example.com/en/products/shoes" />
<xhtml:link rel="alternate" hreflang="fr" href="https://example.com/fr/products/shoes" />
<xhtml:link rel="alternate" hreflang="de" href="https://example.com/de/products/shoes" />
<xhtml:link rel="alternate" hreflang="x-default" href="https://example.com/products/shoes" />
</url>
</urlset>
If you need to create an annotated sitemap, use a tool like Screaming Frog or a Shopify app that supports hreflang sitemaps.
For most Shopify stores, Shopify's default sitemap strategy is sufficient. Focus on getting HTML hreflang tags right first.
Step 6: Test Hreflang Across All Page Types
Hreflang must be consistent across all pages. A product page, collection page, and home page all need hreflang tags.
Test your home page. Visit example.com. Inspect the HTML. Confirm hreflang tags are present and point to the home pages of other languages.
Test a product page. Visit a product page. Inspect the HTML. Confirm hreflang tags point to the same product in other languages.
Test a collection page. Visit a collection. Inspect the HTML. Confirm hreflang tags point to the same collection in other languages.
Test a custom page. If you have custom pages (About, Contact, FAQ), visit them and inspect hreflang tags.
If any page type is missing hreflang tags, your theme code might not be rendering correctly. Check your Liquid code. Make sure it's in the <head> section of theme.liquid, not buried in a partial.
Use Google's Rich Results Test. Visit Google's Rich Results Test. Paste your URL. Google will show you all hreflang tags it detected. This is the gold standard for validation.
Step 7: Monitor and Iterate
Hreflang is not a set-it-and-forget-it signal. Google's algorithms evolve. Your site structure changes. Monitor your hreflang setup continuously.
Check Google Search Console monthly. Look for new hreflang errors. If errors appear, fix them within a week.
Monitor international traffic. In Google Analytics 4, set up proper SEO tracking. Track organic traffic by market. If a market's traffic drops, hreflang might be misconfigured.
Watch for ranking changes. Use a tool like Ahrefs or Semrush to monitor keyword rankings across markets. If a market's rankings drop, investigate hreflang.
Test after theme updates. If you update your Shopify theme, re-inspect hreflang tags. Theme updates sometimes override custom code.
Document your setup. Write down your domain structure, language-region mappings, and hreflang implementation method. When you hand off to a developer or hire an agency, they need this documentation.
Common Pitfalls: What Breaks Hreflang on Shopify
Most hreflang failures aren't caused by misunderstanding the concept. They're caused by small mistakes that cascade.
Typos in URLs. One character wrong—a slash missing, a hyphen instead of an underscore—and Google ignores the tag. Double-check every URL in your hreflang tags.
Inconsistent language codes. Using both en and en-US for English across different pages confuses Google. Pick one format and stick with it. If you use language-region codes, use them everywhere.
Missing self-referential tags. A page doesn't include an hreflang tag pointing to itself. This is a common mistake. Every page must reference itself.
Broken reciprocal links. Page A links to Page B in French, but Page B doesn't link back to Page A in English. Google requires bidirectional links. If you add hreflang to one page, add it to all versions.
Using relative URLs. Hreflang requires absolute URLs with the full domain. https://example.com/products/shoes is correct. /products/shoes is not.
Parameters in URLs. Don't include UTM parameters, session IDs, or other query strings in hreflang URLs. Use clean, canonical URLs only.
Wrong x-default. The x-default tag should point to your primary market or global fallback, not a random market. If you serve English globally, x-default should point to your English version.
Hreflang on paginated content. If you have paginated collections (page 1, page 2, page 3), each page needs its own hreflang tags. Don't use hreflang on pagination links themselves.
Forgetting canonicals. Hreflang and canonical tags work together. Each page should have a canonical tag pointing to itself, plus hreflang tags pointing to other language versions. Don't skip canonicals.
Not testing after deployment. You add hreflang code, save, and assume it works. Test immediately. Inspect the live HTML. Confirm tags are rendering.
Shopify Plus Considerations
If you're on Shopify Plus, you have more flexibility but also more complexity.
Multiple storefronts. Shopify Plus lets you run multiple storefronts on one store. Each storefront can have its own domain, language, and currency. Hreflang becomes critical here because all storefronts share the same product data.
When setting up hreflang on Shopify Plus:
Use storefront-specific Liquid variables. Shopify Plus provides shop.primary_domain, shop.domains, and other variables to detect which storefront is active. Use these in your hreflang code to ensure each storefront links to the correct version.
Example for Shopify Plus:
{% for domain in shop.domains %}
{% if domain.commercial %}
<link rel="alternate" hreflang="{{ domain.localization.country.iso_code | downcase }}" href="https://{{ domain.host }}{{ request.path }}" />
{% endif %}
{% endfor %}
This loops through all domains assigned to your storefronts and generates hreflang tags dynamically.
Test across storefronts. Visit the same product page on each storefront. Inspect hreflang tags. Confirm they point to the correct storefront domains.
Use Shopify's Markets API. Shopify Plus can leverage the GraphQL Admin API to query market data. If you're building a custom solution, use the API to fetch market-to-domain mappings. This is more robust than hardcoding.
Coordinate with your development team. Shopify Plus implementations are custom. Your development team needs to understand hreflang requirements and build them into your theme from the start. Don't bolt hreflang on later.
Integrating Hreflang with Your Broader SEO Strategy
Hreflang doesn't exist in isolation. It's one piece of a larger international SEO strategy.
Pair hreflang with proper canonicals. Every page needs a canonical tag pointing to itself. This tells Google: "This is the primary version of this page." Hreflang then tells Google: "Here are the alternate language versions." Both signals together are powerful.
Learn more about canonicals in our guide on choosing and enforcing your canonical domain.
Submit sitemaps per market. In Google Search Console, submit separate sitemaps for each market if you're using separate domains. This helps Google discover all versions faster. If you're using subfolders, submit one sitemap with hreflang annotations.
For details on sitemap structure, check our guide to generating sitemap.xml for every stack.
Set up geo-targeting in GSC. In Google Search Console, go to Settings > International Targeting. Specify which countries each domain or subfolder targets. This reinforces your hreflang setup.
Configure language meta tags. In addition to hreflang, use the HTML lang attribute in your <html> tag. Example: <html lang="en-US">. This is a secondary signal but still valuable.
Use structured data for localized content. If you're using schema markup (product schema, FAQ schema, etc.), make sure it reflects the language of the page. Google uses schema markup to understand content better.
For schema setup guidance, see our article on setting up schema markup with Google's Rich Results Test.
Monitor with Google Search Console and GA4. Link Google Analytics 4 with Google Search Console to see search queries, impressions, and CTR by market. This tells you whether hreflang is working. If a market's impressions are low despite hreflang, investigate further.
Tools and Resources for Hreflang Validation
You don't have to validate hreflang manually. Tools exist to help.
Google Search Console. Free. Shows hreflang errors, coverage, and international targeting. This is your primary validation tool.
Google Rich Results Test. Free. Shows all hreflang tags detected on a page. Paste a URL and see the output.
Screaming Frog. Paid. Crawls your entire site and reports on hreflang coverage, errors, and inconsistencies. Worth the investment if you're managing a large international site.
Shopify's official documentation. Shopify provides detailed guidance on using hreflang tags in your theme. Bookmark this page. Reference it when you're stuck.
Weglot's hreflang guide. Weglot is a localization platform that works with Shopify. Their guide to hreflang and Shopify is comprehensive and practical.
Shopify's international SEO resources. Shopify publishes guides on hreflang tags and sitemaps for localized content. These are written for Shopify merchants and include Shopify-specific examples.
Technical SEO communities. Subreddits like r/SEO and forums like Moz's Q&A section have active discussions about hreflang. If you're stuck, ask there. Experienced SEOs will help.
Automation: Apps and Services That Handle Hreflang for You
If manual hreflang setup feels overwhelming, third-party apps can automate it.
Hreflang apps on Shopify App Store. Apps like "Hreflang Manager" and "International SEO" automatically generate and manage hreflang tags. They cost $10-50/month but save you time and reduce errors.
Before choosing an app:
- Check reviews. Real merchants should praise it.
- Test on a staging store first. Don't deploy to production without testing.
- Confirm the app supports your domain structure (separate domains, subfolders, or subdomains).
- Ensure the app updates hreflang tags when you add new products or markets.
Localization platforms. If you're using a platform like Weglot, Langify, or Translate.com to manage translations, they often include hreflang management. The platform handles hreflang automatically as you add languages.
Custom development. For Shopify Plus stores, hire a developer to build a custom hreflang solution. This costs more upfront but gives you full control and scalability.
Seoable's audit. If you want a comprehensive SEO audit that includes hreflang analysis, Seoable delivers a domain audit, brand positioning, keyword roadmap, and 100 AI-generated blog posts in under 60 seconds for a one-time $99 fee. We'll review your hreflang setup, identify errors, and recommend fixes.
Shipping Hreflang: Your Action Plan
Hreflang is not optional if you're selling internationally. It's foundational. Here's your action plan:
This week:
- Document your domain structure and language-region mappings.
- Log into Google Search Console. Verify your domain is verified.
- Check your current Shopify theme. Does it support automatic hreflang injection? Inspect a product page's HTML.
Next week:
- If your theme doesn't support hreflang, add the Liquid code from Step 3.
- Deploy to a staging environment first. Test thoroughly.
- Deploy to production. Inspect hreflang tags on live pages.
Following week:
- Wait 2-3 days for Google to crawl and detect hreflang tags.
- Check Google Search Console for hreflang errors.
- Fix any errors immediately.
- Monitor international traffic in Google Analytics 4.
Ongoing:
- Check Google Search Console monthly for hreflang errors.
- Monitor rankings by market using Ahrefs or Semrush.
- Test hreflang after any theme updates.
- Document your setup for future reference.
Hreflang is a one-time setup that pays dividends for years. Get it right now. Avoid the duplicate content penalty. Rank in every market you serve.
Key Takeaways
Hreflang tells Google which version of a page is intended for which audience. Without it, you risk duplicate content penalties and lost visibility in international markets.
Hreflang is required if you serve multiple countries, languages, or regions. One tag per language-country pair, plus self-referential and x-default tags.
Shopify Markets makes hreflang automatic. If you're using Markets with subfolders, Shopify injects hreflang tags for you. Verify they're rendering correctly.
Manual implementation requires Liquid code in your theme. If your theme doesn't support automatic hreflang, add the code from Step 3. Test immediately.
Validation is critical. Use Google Search Console and Google's Rich Results Test to confirm hreflang tags are correct. One typo breaks the entire setup.
Hreflang works with canonicals, sitemaps, and geo-targeting. Don't treat hreflang in isolation. Pair it with proper canonicals, structured data setup, and 301 redirects for domain migrations if needed.
Monitor continuously. Check Google Search Console monthly. Watch for ranking changes by market. Test after theme updates.
Hreflang is technical but not complex. Follow these steps. Avoid the pitfalls. Ship with confidence. Your international SEO will thank you.
Get the next one on Sunday.
One short email a week. What is working in SEO right now. Unsubscribe in one click.
Subscribe on Substack →