How to add canonical tags to your Webflow website for SEO boost

March 30, 2022

You have a mammoth website that is built with Webflow. Hundreds of blog posts have been published, and many more are in the queue. But unfortunately, you’ve recently discovered some  identical pages of a particular one under different URLs on your site. How does Google understand which page is the original? Which version of the page will Google index as a couple of pages look similar?

In this case, you have to identify the main or exact post so that Google can easily crawl and index it, avoiding the rest of the duplicate content. How do you specify the main or primary version of the content? Of course, you have to get help from the canonical tags. What are the canonical tags? How to add canonical tags to your Webflow website? 

To learn everything thoroughly, you need to scroll down here for a while. We’re going to explain all these queries to help you enrich your SEO knowledge. We can assure you that you will gain a solid understanding of canonical tags if you attentively read the entire article. Let’s move on!

Why are canonical tags important for SEO?

The "canonical" tag is unquestionably important for SEO. If your website somehow contains duplicate content, it will affect your search engine ranking. That’s because Google neglects duplicate or copied content either way. Its crawlers refuse to crawl and index multiple URLs with the same content. That means your main content will also not be indexed. 

As a result, the duplicated content endangers your entire website. But there might be duplicate content. You can hardly prevent it from being produced. From this perspective, you need to reach out to canonical tags to sustain your website's ranking and make your site Google-friendly. You have to specify the original version of the content so that Google can easily identify what it should index and rank. 

If you can properly set the canonical tags, Google will never try to discover other copy versions of your web pages. Rather, it will precisely crawl and index the original one within a short amount of time. And eventually, there will be no impact on your website's search engine ranking.  Your site will never come across the risk of a no-index issue with the insightful content.

How to add canonical tags to your Webflow website?

Adding canonical tags to your Webflow website is a fundamental task. You can’t ignore it. If you somehow become neglectful of this chore, you can never dream of getting your website higher in rank. Do you know how to add canonical tags to your Webflow website? If not, you are going to master the process before long with our accurate guidelines. Stick to the following methods to hone your skills. 

You’re invited to CrowdyFlow if you need superior technical support and maintenance for your website. Apart from building super responsive and functional Webflow websites, we offer a complete technical SEO service to our clients. You will find complete solutions on time through our professional SEO experts and developers. 

Adding the canonical tag with custom code:

At this point, we will learn how to add a canonical tag with custom code. It needs to perform several steps to come up with the desired solution. You just need to follow the steps appropriately to rescue your website from duplicate content issues.

Open the Webflow designer:

As you’re going to add a canonical tag to your Webflow website, your first task is to go to the Webflow dashboard. Simply open the Webflow designer to commence your venture towards fixing the most important SEO term. But make sure you have opened the exact site where you’re going to add a canonical tag. 

Go to the CMS collection pages:

On the left bar of the Webflow dashboard, you will find a section called Pages. It’s the section where you create new pages for your site. You can add static, utility, and CMS collection pages in this section. But you have to scroll over the CMS collection pages option to add canonical tags.

how do you add canonical tags to your Webflow website

Go to the blog template:

Once you’ve clicked on the CMS collection pages section, you will discover the Blog Template option. Just click on it and a new page with several fields will pop up. Go to the bottom of the page. You will see the Custom Code field there. 

Webflow blog template

Insert the canonical tag under the custom code section:

Now you’re set to carry out the most important task. In the custom code section, you need to carefully insert the canonical tag. To add a canonical tag to a specific post, insert <link rel="canonical" ref="https://yourwebsite.com/post/replace with slug"/>. You have to replace the link with the exact slug.

webflow canonical tags

Save the collection and verify the pages:

Once you’ve added the canonical tag precisely, it’s time to save it. You need to update your settings and publish your menu to activate the canonical tag field. Then you can verify the pages to ensure the page or post is canonical.

Adding canonical tags with the Webflow global canonical tag option:

Now we will learn how to add a canonical tag with the Webflow global canonical tag option. It’s pretty easy. Just go over the steps once, and you'll never have to struggle to get it fixed again.

Go to the Project Settings option:

Your first and foremost task is to go to the Webflow dashboard. Then click on the Project Settings option. Once you click on it, you will find multiple options aligned horizontally on the interface.

Click on the SEO tab:

You need to find the SEO section from the menu bar. Then tap on the tab. You will see several fields, including indexing, sitemap, Google site verification, and Global canonical Tag URL.

Global canonical tag in Webflow

Scroll down to the Global Canonical Tag URL:

You have to scroll down to the Global canonical tag URL field. With the help of this field, you can ask Google not to serve the duplicated content. The field will help you convince Google of the original or main URL of your blog post.

Global canonical tag URL

Place the canonical tag:

Now it’s time to place the canonical tag on the field. As of now, you may add the base URL of your site as a global canonical tag. This URL will be utilized to generate a canonical tag for each slug of your web page on your website.

Save changes and publish:

After adding the exact tag in the field, you need to save it. You will find a "Save Changes" button on the right side of the page. Simply click on it. Then you need to publish it to ensure Google will index the original version of your web pages. 

Frequently asked questions:

Most people don’t have a clear concept of how canonical tags work and how to set them up. A lot of questions regarding canonical tags are often asked online. In this section, we’re going to highlight some important questions with correct answers. You may gather more information here.

What are canonical tags?

A canonical tag is an HTML tag that specifies the original version of a duplicated or semi-duplicated page. It tells Google which URL needs to be indexed if there are similar URLs for a particular post on a website. As a result, Google can easily identify and crawl the real post by neglecting the copies. 

Should every page have a canonical tag?

To have better SEO practice, all the pages of a website should contain a canonical tag. It will protect the website from the risk of any possible duplication. Besides, the website will look SEO-compliant, authentic, and immaculate.

Do canonical tags affect SEO?

Yes, definitely. Canonical tags directly affect search engine optimization. Your site will face a ranking drop unless you add appropriate canonical tags. You can never hope to get your site ranked on the SERP if lots of duplicate content is available.

Is Google's index page canonical?

Googlebot always tries to find the authentic form of content. It determines the primary content of each page and eventually indexes it. Google has the ability to choose the most complete and useful content to make it canonical. 

How do I edit canonical?

You can edit canonical tags for an individual page. To do so, you need to navigate to your content and hover over an existing page that you need to edit. Then navigate to the Settings tab and go to the canonical URL section. Edit and restructure the tag as per your priority. 

How do I find the canonical issue of a website?

By running a site audit, you can detect canonical issues on your website. You may check your website using a browser extension or SEO tool. During the inspection period, you will find the canonical issues that affect the growth of your website.

Final words:

If your website contains similar content under different URLs, Google will be in a dilemma while trying to identify which one is original. It can’t determine the exact page and ultimately stop indexing it. As a result, your post will not appear in the search results. How to fix this issue? In this case, you need to add a canonical tag to inform Google of the main version of your content. Do you have any ideas on how to add canonical tags to your Webflow website?

For sure, you have- since you’ve looked over the entire case study here. As you’ve found the most appropriate methods of inserting canonical tags to overcome duplicate page issues, you can apply them correctly to achieve a higher search engine ranking. You can follow any of the highlighted methods as per your preference to come up with the best outcomes.