What is the best way to handle canonical links on my website using Webflow?
TL;DR
- Webflow automatically adds self-referencing canonical tags, but you can customize them in Page Settings under "Custom Code."
- For CMS Collection pages, Webflow inserts a default canonical tag, but customization is possible via SEO Meta Title & Description fields.
- Use canonical tags to prevent duplicate content issues, especially for pages with similar content or URL parameters.
- Verify implementation by checking page source and using Google Search Console’s URL Inspection tool.
Properly handling canonical links in Webflow is essential to avoid duplicate content issues and improve SEO. Here’s how to set them up correctly.
1. Use Webflow’s Built-in Canonical Tag
- Webflow automatically generates a self-referencing canonical tag for each published page.
- You can verify this by viewing the page source (
Ctrl + UorCmd + Uin most browsers) and searching for<link rel="canonical" href="...">.
2. Customize Canonical Tags for Specific Pages
If you need to specify a custom canonical link, follow these steps:
- Go to Webflow Designer and open the page settings.
- Scroll down to the "Custom Code" section.
- In the "Inside tag" field, add:
<link rel="canonical" href="https://yourdomain.com/preferred-page-url/">- Click Save and Publish the changes.
3. Use Webflow’s SEO Settings for Collection Pages
- If you’re using Webflow CMS Collection pages, Webflow automatically inserts a self-referencing canonical link.
- However, to customize it, go to Page Settings for the Collection template and use Webflow’s dynamic "SEO Meta Title & Description" fields.
4. Avoid Duplicate Content Issues
- If you have duplicate pages (similar content available at multiple URLs), always set a canonical URL pointing to the preferred version.
- Common scenarios requiring a canonical tag:
- Blog posts categorized under multiple sections.
- Pages with URL parameters (
?utm_source, etc.). - Alternate versions of the same page (e.g., HTTPS vs. HTTP).
5. Test Your Canonical Tags
- Use Google’s URL Inspection tool in Google Search Console to check how Google interprets your canonical tags.
- View the page source (
Ctrl + UorCmd + U) and search for<link rel="canonical">to ensure it’s correct.
Summary
Webflow automatically adds self-referencing canonical tags, but you can customize them in Page Settings. Use custom head code for specific cases, especially on CMS Collection pages. Always verify and test using Google Search Console to ensure correct implementation.