ProductHow it worksDocsBlogPricingGet Framer Plugin
← Blog

Framer SEO for Product Pages: Schema, Canonicals, Indexing

Framer SEO for product pages comes down to three moves: give every product its own indexable CMS page, attach Product schema to that page using CMS variables so each entry gets unique markup, and set canonicals so your Shopify product URLs stop competing with your Framer ones. Framer already handles metadata, sitemaps, and robots.txt on its own. Schema and canonical control are the parts still left to you.

Get those three right and a Framer storefront indexes like any other ecommerce site. Get them wrong and you end up with beautiful pages that Google either skips or credits to the wrong domain.

What Framer SEO means for product pages

Product-page SEO is the work of making one URL per product crawlable, understandable, and uniquely credited in search. On a Framer website builder project that means three layers: the page exists and returns real HTML, the metadata describes that specific product, and the structured data tells Google what is for sale and at what price.

Framer covers the first layer by default. Pages render server-side HTML, and Framer automatically generates a sitemap for every published site along with robots.txt. The second layer comes from Framer CMS dynamic metadata, where {{Title}} style variables fill the title and description for each collection entry instead of repeating one template across 200 products. The third layer is where most Framer stores stall.

Why do Framer and Shopify fight over the same product URL?

Because both can serve the same product, and Google only wants to rank one. If your Framer site renders a product at yourbrand.com/shop/wool-coat while Shopify still serves yourbrand.myshopify.com/products/wool-coat — plus the collection-scoped variant at /collections/outerwear/products/wool-coat — you have handed Google three near-identical pages and no instruction about which matters.

Google is explicit that it will make the call for you if you don't: without a signal, Google "will identify which version of the URL is objectively the best version to show to users in Search." That choice is often the Shopify URL, because it has the older crawl history and the inbound links. This is the ordinary Shopify duplicate content problem, except the duplicate now lives on a different platform you also own.

The fix is a signal with weight behind it. Google rates the methods differently:

A permanent redirect is "a strong signal that the target of the redirect should become canonical." A rel="canonical" link is "a strong signal that the specified URL should become canonical." A sitemap is "a weak signal that helps the URLs that are included in a sitemap become canonical." — Google Search Central

So a sitemap entry alone will not win the argument. Point a rel="canonical" from every Shopify-served duplicate at the Framer URL you actually want ranked, and keep the two consistent. One more trap worth naming: Google says plainly, "Don't use the robots.txt file for canonicalization purposes." Blocking the Shopify duplicate does not transfer its signals — it just hides the page while the ranking confusion stays.

In Framer, the site-level Canonical URL field lives under Settings → Domains and takes effect on republish. That handles the preferred domain. Pointing an individual page at a URL on another domain is a Custom Code job in that page's head.

How do you add Product schema to a Framer CMS page?

You add a JSON-LD script through Framer's Custom Code on the CMS detail page, and you fill it with collection field variables so one template serves every product. Framer's documentation is direct about this: "By referencing CMS fields with the {{}} syntax, you can generate unique structured data for each page." Use the | json filter on every value — {{Title | json}} — so quotes and apostrophes in product names don't break the JSON.

The good news is how little Google demands. A merchant listing needs exactly three required Product properties: name, image, and offers. Inside that offers object you need price and priceCurrency. That's the whole floor. Everything else — brand.name, sku, gtin, availability, aggregateRating, hasMerchantReturnPolicy — is recommended, not required.

Two details catch people out. Merchant listings require an Offer, not an AggregateOffer, because Google expects the marked-up seller to be you. And image fields in Framer CMS output their URL automatically, so {{Image}} resolves cleanly into the image property without extra handling.

If your price and stock live in Shopify rather than in the Framer collection, the schema is only as fresh as the sync behind it. That is the practical argument for keeping product data mirrored into the CMS on a scheduled sync — which is what FramerLink does — rather than hand-typing prices into a collection you will forget to update.

The product-page SEO checklist: Framer vs Shopify themes

Of the five items below, Framer automates two outright and leaves three to Custom Code, while a Shopify theme ships all five preconfigured.

SEO item How to do it in Framer How Shopify themes do it Automatic via plugin?
Product schema JSON-LD in Custom Code on the CMS detail page, values from {{Field | json}} Emitted by the theme's product.json / Liquid schema partial Partly — only if the plugin injects schema from synced fields
Canonical tag Site-level field in Settings → Domains; per-page needs a link tag in Custom Code Theme outputs canonical_url per product automatically No — set it per page
Sitemap Generated automatically at /sitemap.xml, updates on publish, not editable Generated at /sitemap.xml, split by resource type Yes — nothing to configure
Open Graph image Per-page setting, or {{Image}} from the CMS on collection pages Theme meta tags pull the featured image Yes, once the image field is mapped
hreflang Multi Site with rewrite rules, or manual tags in Custom Code Markets emits hreflang for each active locale No — plan it before you build

The pattern is consistent: Framer gives you the hooks and expects you to use them, while a Shopify theme makes the choices for you. That is the trade for design control, and it is only a problem when nobody on the project knows the hooks exist. Our product page template for Framer walks through the layout side of the same build.

Keeping the sitemap clean as the catalog grows

Framer's sitemap updates on publish, which means it inherits whatever your CMS contains — including the half-finished entry someone left published last week. Audit it the way you would audit a feed.

Scale is rarely the blocker. Google limits a single sitemap to 50MB uncompressed or 50,000 URLs, and you must split it past either threshold. Almost no Framer catalog approaches that, so if products are missing from the index the cause is upstream: unpublished CMS entries, a collection with no detail page attached, or Framer CMS item limits quietly capping how many products made it in at all.

What to verify before you call it done

Five checks, in order, each taking about a minute:

  1. Open the live product page's source and confirm one <link rel="canonical"> tag — not zero, not two.
  2. Run that URL through Google's Rich Results Test and confirm the merchant listing validates with name, image, offers, price, and priceCurrency present.
  3. Search site:yourbrand.com and your product name together, then do the same for the myshopify.com domain, and confirm only the URL you want is indexed.
  4. Load /sitemap.xml and spot-check that the product count matches your published CMS entries.
  5. Confirm the price in the schema matches the price on the page, because mismatched markup is the fastest route to a manual action.

Framer SEO for product pages is not harder than Shopify SEO. It is less automatic, and the difference shows up entirely in whether somebody set the canonical and wrote the schema template. Both are one-time jobs that keep paying out across every product you add afterward.

Frequently asked questions

Is Framer good for SEO?

Yes. Framer renders real HTML, generates a sitemap and robots.txt automatically, and exposes per-page titles, descriptions, canonical URLs, redirects, and Open Graph images. The gaps are advanced ones: per-product schema and cross-domain canonicals need custom code in the head rather than a toggle.

Does Framer support structured data?

Framer supports JSON-LD through its Custom Code feature. On a CMS detail page you can reference collection fields with the double-brace syntax, so one script template produces unique Product markup for every entry. Framer documents JSON-LD for articles, products, and events.

Can you set a canonical URL in Framer?

Yes. Framer has a Canonical URL field under Settings then Domains, which sets the site-level preferred domain, and you republish for it to take effect. For per-page or cross-domain canonicals pointing at Shopify URLs, add the link tag through Custom Code on that page instead.

Does Framer create a sitemap automatically?

Framer generates a sitemap for every published site with no setup, available at your domain followed by /sitemap.xml, and it updates each time you publish. You cannot hand-edit it, so controlling what appears means controlling which pages and CMS entries you publish.

Sources