Integrating SEO in Shopify themes is one of the most challenging parts of running an online store, mainly because of the hundreds, if not thousands, of factors that can affect whether a page or site appears in search results or not — and where.
Canonical tags (sometimes referred to as “rel canonical”) are one key way to enhance your Shopify store’s SEO, but like many components of search engine strategy, it is commonly misunderstood and can be confusing.
What is a canonical tag?
It’s important to understand what exactly a canonical tag is.
Canonical tags are a special kind of HTML code included in the <head> portion of web pages’ code that serves as a sort of “signal” for search engines to “read” and interpret.
As an example, the canonical tag for the Turbo Shopify Theme Portland style looks like this:
<link rel="canonical" href="https://outofthesandbox.com/products/turbo-theme-portland" />
Canonical tags are not designed to be seen or read by normal website viewers — but rather by the programs search engines use to “see” the Internet — spiders.
Spiders are, in a way, automated “visitors” to your site that are programmed to look at the code and content on the site and send it back to the search engine’s index.
The search engine’s algorithm, in turn, then uses the information a spider has gathered to decide what results to show and in what order, and determines what and how results are shown on the search engine results pages, or SERPs — sometimes pronounced as “surps.”
Why are canonical tags so important in Shopify?
Canonical tags are particularly important in Shopify for two main reasons.
The first, and most prominent, is due to how the Shopify platform works. The platform allows a single product page to exist at multiple URLs with identical or near identical content.
Canonical tags also play a key role in how paginated pages, such as collection listings and blogs, are indexed by search engines.
Canonical tags on Shopify product pages
In Shopify, every product has a “main” or “canonical” URL that follows the pattern of:/product/product-handle
In the URL path, your domain name comes first, followed by the word /product/ sandwiched by two backslashes and then your product handle.
Product handles are typically automatically generated by Shopify based on your product name, but you do have control over what the handle is — which is actually a key strategy in SEO.
It’s also worth noting that once a user arrives on a product page and changes variants, a string gets added to the end of the URL — something like this: ?variant=19343468487.
This is what is known as a query string which some websites use to display completely different pages. Shopify, however, doesn’t use this approach and instead uses query strings to distinguish between variants on the same master product page and here the canonical tag helps prevent this from being confused as a separate page with identical content.
All in all, the “main” product URL structure is pretty straightforward — but here’s where things get more complicated — with product URLs that feature collections.
Shopify collection based product page URLs
In addition to the “main” URL, Shopify generates an additional page for each product for each collection a product is in.
Because a product can be in one or more collections, this means that each product actually has at least two unique URLs — the “main” one discussed above and one that looks like this:
/collections/collection-handle/products/product-handle
In this type of URL, you can only change the parts in bold by editing either the product or collection handle.
There’s no way to turn off these URLs or prevent them from being generated, other than by removing a product from a collection, but that can have adverse effects in other areas of your Shopify store, so it’s not typically a good strategy.
Keep in mind, that in some very large stores a single product might belong to two, five or even hundreds of collections — which means that a unique URL is generated for every collection the product is in.
For example, a men’s hat product that’s in “Apparel,” “Men,” “Hats,” and “Leather” collections will have product pages at all of the following URLs:
/collections/apparel/products/mens-hat/collections/men/products/mens-hat/collections/hats/products/mens-hat/collections/leather/products/mens-hat
While you can type these URLs directly into the browser, most of the time they are accessed by visitors, including spiders, through an intermediary collection page.
For example, if a visitor comes to your site looking for a leather men’s hat, they might first click a link called “Apparel” that, in turn, links to an apparel collection page.
Another user might opt to browse first by clicking “Men,” or “Hats” or “Leather.” In each of these cases, the shopper will ultimately end up at the same product page, but through a different “path.”
While it may seem odd to create so many URLs, there are a few reasons Shopify does this.
The first is to help with your site usability. Many Shopify themes will display “next product” and “previous product” links as well as related products on product pages.
In order to have this functionality, Shopify needs to know what collection the user saw before visiting the product page. If Shopify knows, for example, that a user came through the “Hats” collection, it typically doesn’t make sense to link to other articles of clothing via “next,” “previous” and “related” product links on the page.
The challenge
One key issue that this URL structure introduces is that you now have at least two pages with almost or completely identical content, but at different URLs.
This potentially could be viewed by a search engine as an attempt to unfairly manipulate SEO to improve your page listings.
The solution
However, this is where the canonical tag comes in. Canonical tags are essentially your way to “tell” the search engine, “hey, I know these pages are identical or nearly so, but here’s the ‘main’ page they all refer to.”
By default, Shopify adds a canonical tag to every page on your site, not just product pages, which is considered best practice. In the case of your homepage or an "about us" type page, the canonical tag will actually be the same as the URL - and that’s fine!
In these situations, the canonical tag is essentially saying, “hey, this page is the main version and there aren’t any other versions of it out there.”
Suggestion vs. directive
It’s important to understand that canonical tags are not considered a “directive” but rather a “suggestion.”
This means pages that have canonical tags that refer to the “main” product page can and will appear in search results.
Often store owners misunderstand that using a canonical tag will remove or prevent the URLs with “collections” in them from appearing in search engine results — and that’s simply not true.
In fact, search engines may purposefully show URLs with “collections” in them because it’s actually closer to what the user searched for — and, by extension, hopefully more likely to convert into a sale.
To better understand this, keep in mind that at the end of the day, the search engine’s goal is to show each user the page that is most likely to be relevant to them.
Search engines have evolved beyond just looking at how many other sites link to a page (commonly referred to as “backlinks”) — to become sophisticated tools that analyze a user’s search habits, patterns, how long they view certain sites, and hundreds of other factors.
Because of this, and the uniqueness of each search query, most search engines may opt to display a non-canonical URL if that page better matches what the user has indicated they’re looking for based on what search term was entered.
For example, if a user searches “leather hats,” a search engine can safely assume that the user is probably only interested in hats made of leather.
Therefore, it might opt to show a link the /collections/leather/products/mens-hat URL rather than just /product/mens-hat.
By giving the user this result, the search engine is betting that by showing them a result that has “leather” in its URL, it will not only most likely match their needs but, if it doesn’t, at least get them to explore other leather hats your store offers.
This is a much different path than if the user searched for “leather hats” and was taken to simply /product/mens-hat, where there may not be relevant related products or “next” and “previous” product links to encourage more exploring in case the product isn’t the right fit.
Should you 'noindex' pages?
There are some documented ways to prevent "duplicate" pages such as paginated collection pages and product pages with collection names in the URL from appearing in search results, mainly through the use of "noindex" tags in the header of these pages.
Adding these tags requires following one of the tutorials available online or hiring a developer — but this is not a solution I personally recommend.
First, there is evidence that having pages or links labeled as "nofollow" can actually do more harm than good with your SEO, presumably because, by instructing the search engine that you have a large number of pages you want to "hide" from them, can be a signal that your site is lower quality.
In addition, there are actually cases when search engines will show a product page URL with the collection name in it because it believes, based on its algorithm and data from thousands of searches, that this page will actually more closely match what the user is searching for — and this could ultimately lead to a sale or user engagement.
Ultimately, using "noindex" tags is essentially saying "Hey, I know these pages are duplicative, but I want to hide them from you" — while canonical tags are a way to say "hey, I know these pages might have duplicative content, but if you think they are more likely to get a click, go ahead and show them to users."
