Framer Canonical Tags: How They Work and How to Set Them

What Canonical Tags Are and Why They Matter

A canonical tag is an HTML element that tells search engines which URL is the "preferred" version of a page when the same or very similar content is accessible at more than one URL. It lives in the head section of a page and looks like this:

<link rel="canonical" href="https://yourdomain.com/blog/my-article" />

<link rel="canonical" href="https://yourdomain.com/blog/my-article" />

<link rel="canonical" href="https://yourdomain.com/blog/my-article" />

The href value is the canonical URL: the address you want Google to treat as authoritative. When Google encounters duplicate or near-duplicate content at multiple URLs, it uses canonical signals to decide which version to index and which version should accumulate link equity and ranking signals.

Why duplicate content happens without canonical tags

Duplicate content is more common than most people realize. It can arise from:

• HTTP and HTTPS versions of the same page both being accessible

• www and non-www versions both resolving (e.g., both www.yourdomain.com and yourdomain.com returning the same content)

• URL parameters creating multiple URLs for the same content (e.g., /blog?sort=date vs. /blog)

• Staging or preview URLs serving the same content as production

• Cross-posting: the same article published on both your Framer site and a platform like Medium

• CMS template pages with very similar structures and overlapping content across items

When Google encounters duplicate content and there is no canonical tag pointing to the preferred URL, it makes its own judgment about which version to index. That judgment may not match what you want, and ranking signals can get split across multiple versions instead of concentrating on one.

Canonical tags are a strong hint, not an absolute directive.

Google treats canonical tags as a strong signal, but it is not obligated to follow them. If other signals contradict the canonical (for example, if the canonical URL has no inbound links and the non-canonical version has many), Google may override your hint. That is why canonical tags work best when combined with consistent internal linking and proper redirect configuration.

The SEO impact of getting canonicals wrong

When canonical tags point to the wrong URL or are missing in situations where duplicates exist, the consequences include:

• Ranking dilution: Link equity and click-through signals are split across multiple URLs instead of consolidating on one.

• Wrong page indexed: Google may index your staging URL, your www variant, or a third-party repost instead of your actual canonical page.

• Crawl budget waste: Googlebot crawls multiple versions of the same content instead of spending that budget on unique pages.

• Impression and click data fragmented: Google Search Console shows performance data split across URL variants, making it harder to understand how a page is actually performing.

How Framer Handles Canonical Tags Automatically

On paid Framer plans with a custom domain connected, Framer automatically inserts a self-referencing canonical tag in the head of every published page. A self-referencing canonical simply points back to the page's own URL.

This is the correct default behavior. A self-referencing canonical signals to Google that this URL is the intended version of the page, preventing any confusion from URL variants like trailing slashes, query strings, or case variations.

What Framer's automatic canonicals cover

Canonical tags require a custom domain on a paid plan.

If your site is still on the .framer.app subdomain or on the free plan, Framer's automatic canonical tag behavior may not function as expected. This is one of several SEO reasons to connect a custom domain early in your site setup.

How Framer handles www vs. non-www

Framer automatically redirects one of the two variants (www vs. non-www) to the other based on how you configure your custom domain. This redirect handles the www/non-www duplicate content issue at the server level, so you do not need a separate canonical tag for it.

How Framer handles HTTP vs. HTTPS

All Framer sites use HTTPS by default. HTTP requests are automatically redirected to HTTPS. Framer's canonical tags always point to the HTTPS version of URLs, so HTTP/HTTPS duplication is handled automatically.

When You Need to Override the Default Canonical

Framer's automatic self-referencing canonicals handle the majority of cases correctly. There are specific scenarios, however, where you need to set a custom canonical that points to a different URL entirely.

Scenario 1: Cross-posting content to external platforms

If you publish an article on your Framer site and then republish the same article on Medium, LinkedIn Articles, Dev.to, or another platform, you have duplicate content at two URLs. You want Google to treat your Framer site as the canonical source, not the platform.

The fix is to set the canonical on the external platform to point back to your Framer URL. Most major publishing platforms have a "canonical URL" field in their post settings for exactly this purpose. Your Framer page's canonical remains self-referencing (the default), and the external copy points to your Framer URL.

Scenario 2: Staging or preview environments

If you use a staging subdomain or a Framer preview URL to review changes before publishing, and that staging URL becomes publicly accessible, Google may discover and index it. The staging pages should have a canonical pointing to the production URL so Google understands they are not independent pages.

Scenario 3: Near-duplicate CMS pages

CMS collections in Framer can sometimes produce pages with very similar content, especially if items share the same category, tag, or author. If multiple CMS items are nearly identical, you may want to point all variants to one canonical URL.

Scenario 4: Content migrated from another domain

If you are rebuilding an existing site in Framer and moving content from a previous domain, you need to decide whether to use 301 redirects (the standard approach) or canonicals. Redirects are almost always the right choice for a full migration. Canonicals are not a substitute for redirects and should not be used as the primary mechanism for domain migrations.

When in doubt: use a self-referencing canonical (Framer's default) for your Framer pages.

You only need to override Framer's default canonical when you have a specific cross-domain duplicate content situation. For the vast majority of Framer sites, the automatic canonical is correct and complete.

How to Add a Custom Canonical in Framer

Framer does not currently provide a dedicated "Custom Canonical URL" field in its page settings interface. To override the default self-referencing canonical with a custom URL, you add the canonical tag directly in the page's custom code head section.

Important: adding a custom canonical via custom code will override Framer's automatic canonical.

If you add a canonical link tag in a page's Custom Code head, it will appear alongside Framer's automatic canonical. When two canonical tags appear on one page, Google will likely ignore both. You need to ensure only one canonical tag is present. The safest approach is to add your custom canonical and then check the published page source to confirm only one canonical exists.

Step-by-step: Adding a custom canonical to a static Framer page

1. In the Framer editor, select the page you want to modify in the left panel.

2. Open Page Settings (the gear icon next to the page name, or click the page and use the settings panel).

3. Scroll down to the "Custom Code" section within Page Settings.

4. In the Head section, add a canonical link tag with your desired URL as the href.

5. Publish your site.

6. Open the published page in a browser, view the page source (Ctrl+U), and search for "canonical."

7. Verify that only one canonical tag appears and that it shows the correct href value.

Site-wide custom canonical via Site Settings

If you need to apply the same canonical logic across your entire site, you can add the canonical tag in Site Settings under Custom Code (Head). Be very careful with this approach: a site-wide canonical in the head will apply the same canonical URL to every page on your site, which is almost certainly not what you want.

Setting Canonical Tags on Framer CMS Pages

Framer CMS pages (collection items) present a specific challenge because each item is rendered using the same template. You cannot set a unique canonical per item through the standard Framer UI without using dynamic CMS fields in custom code.

Option 1: Template-level custom canonical (same canonical for all items)

If you want to point all CMS items to the same canonical URL, you can add a single canonical tag to the CMS template page's Custom Code head. This applies the same canonical to every item using that template.

Option 2: Dynamic canonical per CMS item using a custom code component

If you need a unique canonical URL for each CMS item, you can use a Framer custom code component that reads from a CMS field and outputs a canonical link tag in the document head.

This requires some technical setup. The general approach is:

1. Add a "Canonical URL" text field to your CMS collection in Framer.

2. Populate this field for the items where you need a non-default canonical.

3. Create a custom code component that uses Framer's CMS variable binding to render a canonical link tag using the field value.

4. Add this component to your CMS template page and bind it to the Canonical URL field.

For most Framer CMS sites, the default self-referencing canonical is correct.

Unless you have a specific reason to set custom canonicals on individual CMS items (cross-domain syndication being the main one), Framer's automatic canonical handles CMS pages correctly. Do not add custom canonicals just because your pages have similar structures or templates.

Common Canonical Mistakes on Framer Sites

Here are the canonical tag errors that appear most frequently on Framer sites, along with how to identify and fix each one.

Mistake 1: Two canonical tags on the same page

This happens when you add a custom canonical tag via Framer's page Custom Code head on a page where Framer is already inserting its own canonical automatically. The page ends up with two canonical link tags pointing to different URLs. Google will likely ignore both.

Mistake 2: Canonical pointing to a redirected URL

If your canonical tag contains an old URL that now 301-redirects to a new URL, you have a canonical chain. Google will generally follow the chain and understand the intent, but it adds unnecessary complexity. Always update canonical tags when you change a page's URL.

Mistake 3: Canonical pointing to a noindex page

This creates a contradiction: you are telling Google "this is the canonical URL" while also telling Google "do not index this URL." Google cannot index a noindex page, so the canonical instruction becomes useless. Check that all canonical target URLs are indexable pages.

Mistake 4: Using canonical instead of a 301 redirect for duplicate content

Canonical tags and 301 redirects both tell Google about preferred URLs, but they serve different purposes. A 301 redirect moves users and bots from the old URL to the new one. A canonical tag says "consider this the preferred version" while both URLs remain accessible. For truly duplicate content where you want to consolidate everything to one URL, use a 301 redirect, not a canonical.

Mistake 5: Missing canonical on cross-posted content

If you repost articles from your Framer blog to Medium, LinkedIn, or other platforms without setting the canonical on the external copy to point back to your Framer URL, Google may decide the external platform is the canonical source. Always set canonical URLs when cross-posting.

Canonical vs. noindex: When to Use Which

These two directives are often confused because they both relate to controlling what Google indexes, but they work in fundamentally different ways and are appropriate for different situations.

What canonical does

A canonical tag tells Google which version of a page to treat as the primary version for indexing and ranking purposes. Both the canonical page and the non-canonical page may remain accessible to users.

Use a canonical when: you want Google to know which of two accessible URLs is the "real" one, and you want ranking signals to consolidate on that URL.

What noindex does

A noindex tag tells Google not to include a page in search results at all. The page can still be crawled, but it will be removed from or never added to the search index. The page remains accessible to users via direct URL.

Use noindex when: you have a page you want to keep accessible but never want to appear in Google search results (staging pages, admin pages, thank-you pages, duplicate utility pages).

Decision guide

Do not use canonical as a substitute for noindex.

If you set a canonical on a staging page pointing to your production page, Google may still index the staging page for a period. noindex is a cleaner and more direct signal for pages you never want indexed. Conversely, do not use noindex when you want Google to index content but attribute it to a different URL: that is the job of canonical.

How to Verify Canonical Tags Are Correct

After setting up or modifying canonical tags in Framer, you need to confirm that the live published pages reflect what you intended. There are several methods to do this, ranging from a manual browser check to automated audits.

Method 1: View page source in your browser

This is the fastest manual check. Open your published Framer page in a browser, right-click and select "View Page Source" (Ctrl+U in Chrome or Firefox). Use Ctrl+F to search for "canonical." You should see a single line with the correct href value.

Verify three things:

• Only one canonical tag is present (not two or more)

• The href value matches the URL you intended

• The href uses the correct protocol (https), correct www/non-www format, and has no trailing slash discrepancies

Method 2: Use a browser SEO extension

Browser extensions like Detailed SEO Extension (Chrome), SEO Meta in 1 Click, or similar tools show canonical tags and other SEO meta data for the current page without having to search through source code. These are useful for quick spot-checks when reviewing multiple pages.

Method 3: Use Google Search Console URL Inspection

The URL Inspection tool in Google Search Console shows the canonical URL that Google has determined for a page, which may differ from what you declared in the tag. If Google is overriding your canonical, it will show the canonical it is using under "Google-selected canonical" vs. "User-declared canonical." A mismatch between these two means Google disagrees with your canonical declaration.

Method 4: Use RankFrame for site-wide canonical verification

Checking canonical tags page by page is manageable for small sites, but for Framer sites with dozens of pages or large CMS collections, a site-wide audit is much more efficient. RankFrame's site audit feature scans all pages in your Framer sitemap and flags technical SEO issues, including canonical tag problems.

Important note: RankFrame audits and surfaces canonical tag information. It does not set or modify canonical tags. Canonicals on Framer pages are set either by Framer's automatic behavior or by custom code you add in Framer's page or site settings.

Best practice: verify canonical tags after every significant Framer publish.

Major structural changes to your Framer site (URL slugs changing, CMS collections restructuring, new domain connections) can affect canonical tags. Build a habit of spot-checking canonical tags on key pages after significant publishes.