Do you want to set a custom canonical URL in Shopify? Then, follow this guide till the end.
Your website may have a nearly duplicate version of products, collections, or other pages. This can lead to duplicate content, which can harm your site’s search engine optimization. One way to prevent this is to use canonical tags in Shopify.
In this post, learn how to edit canonical tags in Shopify and optimize your store.
What is a Canonical Tag?
It’s a meta tag inside HTML code that points to the original version of the page when multiple pages contain the same content. It tells the search engine crawlers which version to prefer for crawling and indexing among the duplicates.
It’s also called “canonical URL” because it contains the URL of the original page.
The tag is added inside the <head> like:
<link rel="canonical" href="https://example.com/original-url/" />In simple terms, the tag tells the crawlers, “Hey! This is the original version of this page you should crawl and index.”
Importance of Canonical URLs in Shopify
E-commerce stores generate more than one URL for the same page. For example, a product page can be accessed via its original URL as well as collection-based URLs:
- https://hiutdenim.co.uk/products/yearbook-6
- https://hiutdenim.co.uk/collections/do-one-thing-well/products/yearbook-6
For search engines, this means multiple URLs have the same content.
Thankfully, Shopify already adds a canonical tag containing the original URL to every page.
The canonical tag in Shopify comes directly from the theme code file.
How to Edit Canonical Tags in Shopify for SEO?
In many cases, you may want to set custom canonicals to prevent content duplication. Here are two main approaches to this:
- Shopify app (easy method) – The MIT Canonical URLs app offers a simple interface to specify canonical URLs for products, collections, pages, and blogs. It can be installed in under 5 minutes and requires no complex setup or technical expertise.
- Modify theme code – In Shopify, you can modify the existing theme code to override the default canonical URLs using meta fields. However, this method requires a thorough understanding of technical concepts and is not suitable for novice users. Also, tampering with theme files may even break your website, leading to SEO issues and business loss.
In the following sections, we cover each of these methods in detail.
Method 1: Use the MIT Canonical URLs App for Shopify
The MIT Canonical URLs app by Meetanshi is the easiest option to edit canonical URLs in Shopify. It offers a simple grid where you can manage canonical URLs for various items in your store. The app requires no theme edits, coding, or complex steps.
Install the MIT Canonical URLs app in your store and start a free trial (no payment required!)
In the app dashboard, you get a list of products in your store and the canonical URL fields against them. From this dashboard, you can edit canonical tags for:
- Products
- Collections
- Pages
- Blogs
- Blog posts (articles)
To set a canonical URL for a specific product, edit the canonical URL field against its title and click Update. For example, here we set it to “https://example.com/”
The canonical tag URL will get modified for that product page in the frontend.
To verify this, open that page URL in a browser > right click > view page source. Then, search for the “canonical” in the code to verify the implementation. In this example, you can see that the canonical link URL has been successfully modified.
Similarly, you can use the app to modify canonical tags for collections, pages, blogs, and articles in Shopify without any coding.
The MIT Canonical URLs app requires no changes and works with all Shopify themes. Further, you don’t need to modify any theme code or worry about any effect of theme changes on canonical tags. The app directly sets canonical tags in theme codes (unlike other apps that use JS to set canonicals after page load), making it an ideal solution for SEO.
MIT Canonical URLs
Easily set custom canonical tags/URLs. Fix duplicate content issues & prioritize URLs for crawling.
Method 2: Modify Canonical Tags in Shopify via Coding
First, create metafields for canonical URLs for products, collections, pages, etc. Then, modify the Shopify theme.liquid code to render the metafield values in place of the default canonical tag.
Let’s go through the steps on how to modify canonical link URLs in Shopify products.
Step 1: Create Metafields
Log in to your Shopify admin and go to Settings.
Go to Custom data in the left menu.
Select Products to create a custom metafield to store custom canonical URL values.
Now, create a new metafield definition with the name “Custom Canonical” (This will create a key custom.custom_canonical which will be used later.)
Set the type as URL and save it.
Step 2: Modify theme.liquid Code
By default, Shopify themes add canonical URLs to all pages. To replace it with a custom one, we need to modify the default canonical tag liquid code.
In the Shopify admin, go to Online Store > Themes and edit code for the current theme.
In the theme editor, open the theme.liquid file and find the following line in it:
<link rel=”canonical” href=”{{ canonical_url }}” />
Then, replace it with the following liquid code to conditionally set canonical from metafields:
{% if product %}
{% assign custom_canonical_url = product.metafields.custom.custom_canonical %}
{% if custom_canonical_url %}
<link rel="canonical" href="{{ custom_canonical_url | escape }}" />
{% else %}
<link rel="canonical" href="{{ canonical_url }}" />
{% endif %}
{% else %}
<link rel="canonical" href="{{ canonical_url }}" />
{% endif %}
Now, save the file.
Note: In case, the canonical_url tag snippet is not present in theme.liquid file, look for files with name meta-tags.liquid.
Step 3: Specify Canonical URLs
In the Shopify admin, go to Products and click the product to add a custom canonical.
Scroll down to the Metafields and specify the custom canonical URL (for e.g., https://example-canonical-url.com/)
The canonical URL will be added to the product. You can check the HTML code of the page on the frontend to verify the tag <link rel=”canonical” href=”https://example-canonical-url.com/”>.
Similarly, you can create custom canonical metafields for other types of pages and modify code to set up canonical tags. You’ll also need to implement an if-else logic to render the right canonical tags according to templates.
One major downside of this method is that the canonical URLs may stop working as soon as you publish another theme. You may need to repeat the steps to modify liquid codes. Further, there is a risk of breaking the storefront design in case of any error or mistake in the liquid code.
We do not recommend this coding method for adding canonical tags on live stores unless you’re an experienced developer. Therefore, our team built a simple app to do this without any coding. It’s easy and 100% safe to use with any theme.
MIT Canonical URLs
Easily set custom canonical tags/URLs. Fix duplicate content issues & prioritize URLs for crawling.
Expert’s Comment on Shopify Canonical Tags
In most cases, you don’t need to modify the default canonical URLs in Shopify. However, there are some special scenarios where you may want to consolidate SEO value, like having almost similar products, collections, or pages.
The MIT Canonical URLs app for Shopify by Meetanshi is a go-to choice for store owners who want to quickly implement custom canonicals and fix duplicate content issues.
