Multi-Store Hreflang Tags Shopify App
If you have two or more Shopify stores for the same business serving different countries or languages, you may be losing traffic and sales from poor SEO.
The hreflang tag tells search engines like Google what version of the page from what store, to serve users. The tag also prevents duplicate content penalties from similar content being on multiple stores.
The SEO Challenge With Shopify
Nearly all Shopify stores do hreflang tags with a {{ canonical_url }} value. The big SEO mistake is you must have the exact same collections, products, pages, blogs, blog tags, and articles in each store—all with the same URL handle—otherwise your tags will point to non-existent pages (404s).
If one store doesn’t contain all the same products, or any URL handle for a store varies between another store, standard hreflang tags in Shopify are bad for SEO. Google will crawl non-existent pages and you will lose organic traffic.
The way to historically solve this problem is to have the exact same store setup and URLs across all stores. If you have stores in different languages, that is bad for SEO, and bad for the user experience, because your URL handles should be in the same language as the store.
Grow with Multi-Store Hreflang Tags
Your Shopify stores can now have perfect hreflang tags to increase sales from organic search.
Without the app, your customers may be taken to the wrong store when coming from Google search, which can lead to confusion in international shipping and poorer conversion rates.
By using the app, organic conversion rates may increase as visitors are served the correct store for their region and language in search results.
If you’ve previously used a universal language in your URLs across stores to deal with hreflang tags, you can now catapult SEO and improve the user experience with URL handles in the same language as the store.
Highlights
- Designed by 6-year Shopify SEO experts so you know your tags follow best practices. Works for all content types. Collections, products, pages, blogs, blog tags, and articles will be matched so stores have perfect hreflang tags.
- Integrates with Shopify’s native language translation used by most language apps like Langify, Translate My Store, and Weglot. Don’t make the mistake of depending on their hreflang tags for multiple stores.
- Works with Shopify’s International Domain feature where one Shopify account has multiple domains or sub-domains.
- Install the app on any store with any language whose SEO you want to optimize. If you have four Shopify accounts for a business, install it on each account.
- Automatic or manual installation of liquid. No messy code surprises. Easily roll out the app.
- Save hours of work. Products instantly map to each other based on SKU values. Any articles, blogs, collections, and pages with the same URL handle instantly map.
- Partner friendly. Contact us for support.
How to Get Your Hreflang Tags Perfect
- Install the app in each store with the automatic option. You will sync the stores together under your one account.
- Map any content types not automatically mapped.
- Remove any previous bad hreflang tags.
That’s it. Give Google a few weeks to crawl your stores and the big G will be happy. We’re happy to review step 1 for you and do step 3.
Frequently Asked Questions
Install the app through the Shopify marketplace for each store. Upon installing, you are asked to do an automatic or manual installation.
Each option inserts a file called multi-store-hreflang-tags.liquid into the snippets folder on your live theme. If you choose the automatic option, {% include 'multi-store-hreflang-tags' %} is also inserted between the <head> and </head> tags of your live store. The manual install requires you to insert this line of code yourself.
These are the only changes to your theme. The remaining data is stored in metafields, which is independent of themes.
If you forget whether you did a manual or automatic installation, view the source code of your page then search for <!-- /snippets/multi-store-hreflang-tags.liquid from apps.shopify.com/multi-store-hreflang-tags -->. That means the one line of code is installed and you likely did an automatic installation.
It’s dead-simple. Once your stores are connected, products automatically map based on SKU value. Other content types will automatically map if they have the same URL handles. For ones with no match, you manually match them like you would in a spreadsheet. Watch this example:
Yes, you can. Copy the multi-store-hreflang-tags.liquid file from the “Snippets” of your live theme into your development theme. Insert {% include 'multi-store-hreflang-tags' %} between the <head> and </head> tags of the development theme’s theme.liquid file. This is the only change needed to preview your new, SEO-perfect hreflang tags.
To ensure it doesn’t appear in your live theme, check that {% include 'multi-store-hreflang-tags' %} is not in the theme.liquid file of your live theme.
The app is made to solve the problem of having different products, collections, pages, blogs, blog tags, and articles between stores.
After being certified Shopify Experts and managing the SEO of Shopify clients for over 5 years, we saw the problem in Shopify with how stores talk with each other for SEO. It was non-existent. As a result, any alternative solution to do hreflang tags did damage to SEO.
The app solves the problem by syncing all content types across stores in a table-like design. This means you can tell Google, for example, that product A doesn’t exist on another store. Or if collection A has a different URL on another store due to language, the hreflang tags remain synced.
Whatever you do with redirects between stores has no effect on hreflang tags.
On redirects and serving pages, Google says:
Whatever configuration you decide to go with, you should make sure all the pages—including country and language selector pages—have rel-alternate-hreflang annotations.Google Search Central Blog
This means Google wants to see hreflang tags on your stores even if you redirect or give users the option to swap between websites. It is best practice to explicitly indicate the language and sometimes region of pages through hreflang tags to help organic SEO.
The default option in the app sets what store you want to have the x-default hreflang tag. Think of it as your catch-all store where you want people to go if they shouldn’t go to any other store. For most Shopify businesses, this is their US store.
Google says, “The new x-default hreflang attribute value signals to our algorithms that this page doesn’t target any specific language or locale and is the default page when no other page is better suited.” They recommend using the x-default feature as a fallback even though it’s not mandatory.
Click on the store that was updated from within the app, then sync the domains. The language update will be detected and the tags will begin to refresh.
There is one simple file created by the app. Copy the multi-store-hreflang-tags.liquid file from the “Snippets” of your live theme into your development theme. Insert {% include 'multi-store-hreflang-tags' %} between the <head> and </head> tags of the theme’s theme.liquid file.
You can archive a store within the app. This unpublishes hreflang tags from your account. You will still be billed. To stop billing, you also need to remove the app via the Shopify apps of your admin.
If you want to remove all pieces of code, remove the multi-store-hreflang-tags.liquid file in the “Shippets” folder and remove {% include 'multi-store-hreflang-tags' %} from your theme.liquid file.
Please reach out to our support by filling in the contact form. Share your question(s) or issues, and share as much detail as possible to stop emails going back-and-forth. If it helps to include screenshots, you can include screenshots that are privately hosted online because attachments through the contact form are not possible.
Removing Other Bad Hreflang Tags
During the installation process, you’re asked to remove hreflang tags inserted from other apps or Shopify. This does not affect the app, but multiple hreflang tags confuses Google.
We suggest removing old hreflang tags once the app is installed in all stores. Mapping does not need to be complete. Most multi-regional and multi-lingual Shopify stores have poor hreflang tags to begin with.
By installing the app in all stores, you will automatically have the home page mapped and all products will auto-map if they have the same SKU value.
Most translation apps like Langify v2, Translate My Store, and Translation Lab use Shopify’s native single-store hreflang tags. The app removes the tags through the multi-store-hreflang-tags.liquid file.
Shopify inserts its hreflang tags through {{ content_for_header }} in the theme.liquid file. The multi-store-hreflang-tags.liquid file created by the app removes Shopify’s unwanted hreflang tags. You just need to make sure {% include 'multi-store-hreflang-tags' %} in your theme.liquid file appears before {{ content_for_header }}.
Remove all other hreflang tags by searching “hreflang” in the theme.liquid file. If you can’t find the tags, they may be in the snippets folder. You can use Bold’s Shopify Theme Search Chrome extension to locate where the tags are inserted.
Getting Geeky Questions
When no language or region from the hreflang tag matches a user’s browser setting, the x-default tag lets you tell Google what page to take users to. Setting a default is best practice for when no languages match.
The app lets you set one store as the default, which uses a value of hreflang="x-default". Alternatively, no default can be set. Individual pages cannot be changed to a default different to the store settings.
One of the main reasons we made this app is to solve the problem of different content between stores!
If an unpublished product page was included in the hreflang tags on the same SKU of another store, it would generate a 404. That’s not good for SEO.
Any product, collection, page, article, or blog not live will not be linked to via other hreflang tags.
If you have a unique type of content on one store but no other, you can add it as a mapping (with it as the only entry) so that it has hreflang tags that point to itself. Some experts may argue this is unnecessary. Without any mapping, there are no tags on the page. If the store has multiple languages, adding the store as the only mapping adds the correct hreflang tags to it.
Pagination is a sequence of numbers for content. In ecommerce, it’s primarily a usability feature that lets people navigate between multiple pages of a product category. The alternative is to have all paginated products displayed on one page, which can cause confusion and excessive load times.
Shopify often paginates collection content. How should you best handle hreflang tags for these pages to maximize your international SEO?
If an English store has products D, E, and F on page 2, while the German version of the store has products F, G, and H on page 2, it makes sense from an SEO perspective to not point the hreflang tags on these pages to page 2 of each store. The content is different to each other. Similarly, a page 2 on one store may not exist on another, which can constantly change based on product availability. It gets messier when canonical tags come into play, and they always do in Shopify. Here’s why.
Shopify canonicalizes paginated URLs to themselves. The page /collections/all?page=2 will have a canonical tag of:
<link rel="canonical" href="https://example.com/collections/all?page=2">
Google’s John Mueller said if this happens, one of the hreflang tags should mention /collections/all?page=2:
Make sure any rel=canonical you specify matches one of the URLs you use for the hreflang pairs. If the specified canonical URL is not a part of the hreflang pairs, then the hreflang markup will be ignored.
On the back of Mueller’s guidance, and to avoid paginated content with hreflang tags pointing to 404s, the app does not have hreflang tags on paginated pages. SEO experts agree not having hreflang tags on paginated pages with canonical tags is best. For more evidence, watch John discussing this issue in an office-hours hangout.
When it is the first paginated page, hreflang tags are included because they match the canonical URL and won’t result in any 404s. For example, the page /collections/all?page=1 has the following canonical and hreflang tags:
<link rel="canonical" href="https://example.com/collections/all"> <link rel="alternate" href="https://example.com/collections/all" hreflang="en"> <link rel="alternate" href="https://example.com/collections/alle" hreflang="de-de">
Shopify canonicalizes product variant URLs to the product URL. The page /products/product-name?variant=1234567890 will have a canonical tag of:
<link rel="canonical" href="https://example.com/products/product-name">
Variants URLs have hreflang tags that point to the primary URL, not the variant. This is called a “non-self referencing canoncial tag”. Following Google’s advice revealed in the FAQ “How is paginated content handled?“, this is done in order that hreflang tags match the rel=canonical link.
Yes. The language follows Google’s requirement of being in ISO 639-1 format. The region also follows their requirement of being in ISO 3166-1 Alpha 2 format.
A language can differ from the region. A region can be ignored. However, a language must be specified to meet Google’s advanced SEO requirements.
Thanks to the app, you can have hreflang tags like the following in Shopify:
en: English language content with no region
en-au: English language content for Australian users
es-mx: Spanish language content for Mexican users
Semrush always produces an error of “No-self referencing hreflang” or “Conflicting hreflang and rel=canonical” for well-implemented hreflang tags in Shopify. Similarly, a ahrefs.com audit will produce an error of “Conflicting hreflang and rel=canonical”.
These messages are inaccurate with SEO best practices for hreflang tags. The errors occur because pages that are not the canonicalized version have hreflang tags that point to the canonicalized version.
This is the correct way to setup hreflang tags as Google’s John Mueller famously advised:
Make sure any rel=canonical you specify matches one of the URLs you use for the hreflang pairs. If the specified canonical URL is not a part of the hreflang pairs, then the hreflang markup will be ignored.
You may see a fluctuation of visibility report in Semrush or performance metrics in Google Search Console. This can happen the day the app is implemented as Google begins to correctly shuffle traffic between stores.
There are plenty of tools that will check tags on a page-by-page basis to confirm the errors reported in Semrush or ahrefs.com are false. The most reliable, comprehensive way to double-check your hreflang tags is with Screaming Frog. You can run a crawl of one of your stores then click the “Hreflang” tab at the top to see your tags.
Fix Your Shopify SEO Today
Get the Multi-Store Hreflang Tags app from the official Shopify Apps store today: