Navigating the March 2024 Google Core Update: Insights & Tips
Unravel the March 2024 Google Core Update with our easy-to-understand guide, perfect for the general public, e-commerce professionals, and…
Navigating Shopify Hreflang
- Fred Cohen
Shopify now has greater international capabilities with Shopify Markets. One big challenge is with hreflang, among other multi-site issues. Many eCommerce sellers are vying to enter the international markets. This makes the hreflang issue on Shopify Plus a big deal.
Trying to get multiple independent Shopify stores translated into different languages is already complicated and costly. Trying to keep up with multiple minor changes every now and then can quickly turn into a nightmare. A smooth multi-site experience would be much more appealing, but the architecture just isn’t in place.
As far as hreflang goes, it does not look complicated at all on its own. As straightforward as it might look with Shopify, though, most actual implementations need some extra work done for hreflang to work properly the way one would want it to.
Hreflang Edge Case Issues
Three main edge cases usually cause issues with hreflang implementation on Shopify stores.
First, we see pages going down on multiple stores. These include main website pages, product pages, associated collections, and even blog posts. Any page that’s not available across a brand’s storefronts can post major problems for visibility and search engine rankings over time. To avoid having hreflang links leading users and crawl bots to 404 errors, Shopify developers must not apply blanket rules. This is the main problem although the following are more well-known issues.
Second, we have seen GEO IP conflicts. This is when Google and other search engines are not able to crawl all of the alternate links on a site because of GEO IP redirects. This can be problematic for indexing and ultimately, rankings as well. Third, hreflang tags can show dynamic pages even when these pages are tagged as noindex or canonicalised. This goes against the whole point of marking something as not to be indexed, and also setting up canonicals to avoid duplicate content issues.
But let’s not get ahead of ourselves.
What is hreflang?
Hreflang is an html attribute. It functions to highlight versions of any page on a website based on region-specific and / or language-specific differences. This is so that search engines can view them as versions of the same website with the same content, just in another language. The rel alternative annotations that go along with this attribute are there so that search engines can easily grasp the differences. Namely, for example, a crawler would know that a site owner designed one page for users in this region or using this language while he had another page for users in that region or using that language.
This distinction is fairly simple, and implementing the html attribute to set it should not be complicated. However, hreflang is actually very complex. The difficulty becomes worse when you have a large website that has complicated and inconsistent catalogues. Because Shopify has not yet built the architecture to resolve this issue, sellers with hreflang issues may need to hire professional SEO services to help them sort everything out before they lose their hard-earned search engine positions.
Why all the Complications with Shopify?
Right off the bat, one can imagine that the issue has a lot to do with Shopify’s multi-store inadequacies. If you assumed that, you are correct. Because Shopify does not have what we call a native multi-store offering, Shopify stores will naturally not play well with hreflang. This is simply because the way Shopify builds does not consider the need for something like hreflang.
Shopify retailers have learned to deal with the international selling shortcomings of the eCommerce platform. Most of them simply build out totally independent stores for each region that they serve. This has its own issues, exactly because these stores are independent. The stores are not linked with each other, so they don’t use the same product IDs or tags that link them together.
Because they are totally separate, the Shopify stores would need to have the same URL handles for all of the page types. Then, the domains would need to change at the theme level. The hreflang setup would in this case, therefore, be a matter of setting the default and language tags within the rel alternatives themselves. A developer would need to set all these individually for every page, collection, product, and blog post. It is a cumbersome process and depending on the number of annotations needed, highly prone to error because the edits being made are basically done manually.
An additional challenge surfaces when you are dealing with different cases for different stores. For instance, if the Great Britain version of the store has products that the United States version of the store does not. The stores will not be able to identify the pages that don’t exist, and so they will all get crawled, resulting in 404 errors that damage the website’s search engine reputation.
The only solid, fool-proof solution for this issue so far is to externally create a custom matrix, or possibly to store values externally in a Product Information Management (PIM) system. This entails a lot of manual work with some theme logic through metafields and / or theme options.
So How Should hreflang be Handled?
When dealing with hreflang issues on multiple Shopify stores, we can point to two main solutions. One is to use the same product, collection, page, and blog post URL keys, manually adjusting for any particular site differences. This will be done by way of either metafields or theme options. Another solution is to store all the needed hreflang references as metafields, but we don’t recommend this. The process is overly complex and therefore highly prone to error without PIM software, especially because you’re managing them manually and doing edits across several stores. The only way that this makes sense is if a retailer is big enough to warrant using a PIM to manage the customised data and push the local URL key version data into Shopify as metafields. Note that this solution only helps with products.
Related Insights
Need an answer to a problem? Take a look at our insights section to find advice, guidance and recommendations across a range of e-commerce topics – from conversion to retention and loyalty, from systems integration to remarketing.
