Clariola
Blog/technical seo7 min readLeer en español

Schema markup in Webflow: how to add it to static pages and CMS templates

Where to put JSON-LD in Webflow, how to bind CMS fields, and what to delete

Monitor showing a website design layout, representing schema markup setup in Webflow

How do you add schema markup in Webflow?

To add schema markup in Webflow, open the page in the Pages panel, click the settings icon, scroll to the Schema markup section, paste your JSON-LD (or click Generate schema markup to let Webflow AI draft it), save, and publish. On a CMS Collection template, you do the same in the template's settings and bind Collection fields so every item page outputs its own values. Sitewide blocks such as Organization can still go in Site settings → Custom code → Head code. Pick one location per block, because Webflow itself warns that schema in both the field and custom code creates duplicates.

The news hook: Webflow added that native field recently, and most Webflow schema tutorials online still describe the older custom-code-only method. At the same time, Google keeps retiring rich results (FAQ ones stopped showing on May 7, 2026), so a lot of the markup those tutorials teach no longer does anything in Google. This guide is the Webflow-specific deep dive of our guide to schema markup for AI search, which covers which schema types matter and why.

Webflow's two places for schema: the native field vs custom code

Webflow's help article Add schema markup in Webflow to improve SEO and AEO documents the native field. The older route is custom code, documented in Custom code in head and body tags. Here is how they compare:

QuestionSchema markup fieldCustom code
Where it's setPage settings → Schema markupSite settings → Custom code → Head code, or Page settings → Custom code
ScopeOne page or one Collection templateWhole site (Site settings) or one page
Where it landsIn the <head>Head code: <head>. Footer code: before </body>
AI draftingYes, “Generate schema markup”No
Plan neededPaid Site plan or paid WorkspaceCore, Growth, Agency or Freelancer Workspace, or an active Site plan
Size limitNot stated50,000 characters per section

A practical split that avoids duplicates: put the one Organization (or LocalBusiness) block in Site settings → Custom code → Head code so it loads everywhere, and use the native Schema markup field for page-specific types: Article or BlogPosting on the blog template, Product on product pages, Service or LocalBusiness on location pages. Webflow says existing custom-code schema keeps working, so you don't have to migrate old blocks. Just don't copy them into the new field too.

A real example: the Webflow FAQ schema trap

Search for “Webflow FAQ schema” and the top results, including BRIX Templates’ step-by-step guide, show you how to build FAQPage JSON-LD from a CMS collection. The technique is sound, but the payoff is gone. Google's Search Central changelog recorded on May 8, 2026 that the FAQ rich result “will no longer appear in Google Search starting May 7, 2026”, and later removed the FAQ documentation entirely. It had already been limited to well-known government and health sites since September 14, 2023, the same day How-to rich results were dropped.

So a typical Webflow site we see looks like this. Before: a hand-built FAQPage block on every service page, no Organization block, and a blog template with no Article markup at all. After: one Organization block sitewide, BlogPosting bound to CMS fields on the blog template, Service or LocalBusiness on service pages, and FAQPage kept only where a visible FAQ section really exists. The markup that remains describes the business and its content, which is what search and AI systems use to identify you.

If you're not sure which of your pages carry leftover or duplicate markup, a $9.99 Clariola audit crawls your raw HTML, lists the schema types found on each page and flags the ones Google has retired, with the retirement date.

How to add schema markup to a Webflow CMS template, step by step

  1. Check what already exists. Open a published item page, view the source (Ctrl+U / Cmd+Option+U) and search for application/ld+json. Marketplace apps, embeds or an old template may already output markup.
  2. Fix your fields first. The Schema markup field can bind Plain text, Image, Video link, Link, Email, Phone, Number, Date/Time, Switch, Color, Option and File fields. It can't bind Reference, Multi-reference or Multi-image fields. If your author is a Reference to an Authors collection, add a Plain text field such as “Author name” to the posts collection and fill it in.
  3. Open the template settings. In the Pages panel, hover over the Collection template (for example “Blog Posts Template”), click the settings icon and scroll to Schema markup.
  4. Generate or paste. Generate schema markup uses Webflow AI, which must be on in Workspace Settings → General → Workspace, and it automatically includes relevant Collection fields. If you paste your own JSON-LD, bind a field wherever a value changes per item. The field must be empty before you can generate.
  5. Review every line. Treat AI output as a draft. Delete properties that describe things not visible on the page, and delete any FAQPage or HowTo block unless the page really has that content.
  6. Save and publish. Nothing reaches the live site until you publish to the staging or custom domain.
  7. Test two different items in Google's Rich Results Test and the Schema Markup Validator. Pick one item with a long title or a quotation mark in it: that is where field-bound JSON usually breaks.

Here is a BlogPosting template for a Webflow blog. The bracketed values are where you bind Collection fields; everything else stays static:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "BlogPosting",
  "headline": "[Name field]",
  "description": "[Post summary field]",
  "image": "[Main image field]",
  "datePublished": "[Published date field]",
  "dateModified": "[Updated date field]",
  "author": {
    "@type": "Person",
    "name": "[Author name field (plain text)]"
  },
  "publisher": {
    "@type": "Organization",
    "name": "Your Business",
    "logo": { "@type": "ImageObject", "url": "https://www.example.com/logo.png" }
  },
  "mainEntityOfPage": "https://www.example.com/blog/[Slug field]"
}
</script>

Three details that break Webflow schema

What Google actually uses from your Webflow markup

Google's introduction to structured data recommends JSON-LD and says it can read JSON-LD that is injected by JavaScript, but Webflow's native field and custom code both place it in the published HTML, which is better for crawlers that don't run scripts. Google's structured data guidelines require the markup to describe content that is visible on the page. That is the rule AI-drafted schema breaks most often: it adds ratings, prices or opening hours the page doesn't show.

Also keep expectations realistic. Valid markup makes a page eligible for rich results, it doesn't guarantee them, and Webflow's own FAQ on the feature says the same. Breadcrumb rich results, for instance, only show on desktop since Google's January 22, 2025 change. The lasting value is entity clarity: consistent Organization data and accurate page types help Google and AI systems understand who you are.

Schema is one layer of that. If you want AI systems to cite you, also read how to get cited in Google AI Overviews, whether an llms.txt file is worth adding to your Webflow site, and how AI website builders handle SEO compared with Webflow. This guide is also available in Spanish.

Localization and multi-locale Webflow sites

If you use Webflow Localization, you can add locale-specific schema manually to pages in secondary locales. During the beta, AI generation only works in the primary locale. Translate the headline, description and inLanguage values yourself, and keep the Organization name and url identical across locales so both versions point to the same entity.

When you need an audit

A Clariola audit for $9.99 reads your Webflow site the way a non-JavaScript crawler does, lists the schema types on each page, flags types Google retired (with the date), and reviews your SEO, content structure, competitors and AI-search visibility. You get a prioritized PDF action plan by email, so you know which Webflow settings to fix first.

FAQ

Does Webflow add schema markup automatically? Not in general. You add it yourself through the Schema markup field in Page settings or through custom code. Webflow AI can draft it for you, and some Marketplace apps generate it, but check the page source to see what is actually output.

Can I use Reference fields in Webflow schema? No. Webflow's Schema markup field doesn't support Reference, Multi-reference or Multi-image fields. Add a plain-text field that mirrors the value you need, such as the author's name.

Should I move my old custom-code schema into the new field? You don't need to. Webflow says custom-code schema keeps working. What matters is not having the same block in both places.

Keep reading