How to Design Conversion-Driven Contact Forms in Webflow

If you want Google to better understand your Webflow website and increase your chances of showing up with rich snippets in search results, structured data (also known as schema markup) is essential.

Read time:
2 minutes
Author:
Bojana Djakovic
Published:
November 6, 2025

While many CMS platforms rely on plugins to handle schema, Webflow gives you complete control. You can easily implement structured data manually, without adding additional scripts or integrations. In this step-by-step guide, you’ll learn how to add JSON-LD schema to your Webflow pages and CMS templates.

What is structured data and why is it important

Structured data is a snippet of code that helps search engines interpret the content of your page. It describes your page in a language that search engines understand called JSON-LD and can result in improved visibility through rich results (such as star ratings, FAQ drop-down menus, or featured snippets).

Here’s why it’s important:

  • Improves how Google interprets your content
  • Enables rich snippets and visual search enhancements
  • Increases your clickthrough rate (CTR)

Helps your content qualify for voice and artificial search

  1. Choose the right schema type - Different pages require different schema types.
    • Page type Recommended schema
    • Blog post Blog post
    • Home page or website layout
    • Product page Product
    • Local business page Local business
    • FAQ section FAQ page
  2. Generate your schema code - Use a free online generator like:
    • Merkle Schema Generator
    • RankRanger JSON-LD Generator
    • For example, here's an example schema for a blog post:
<script type="application/ld+json">{
"@context": "https://schema.org",
"@type": "BlogPosting",
"headline": "How to implement structured data (schema) in Webflow without plugins",
"description": "Learn how to manually add JSON-LD schema markup to Webflow for better SEO and rich results.",
"author": {
"@type": "Person",
"name": "Bojana Đakovic"
},
"publisher": {
"@type": "Organization",
"name": "Webflow Agency",
"logo": {
"@type": "ImageObject",
"url": "https://yourwebsite.com/logo.png"
}
},
"datePublished": "2025-11-06",
"mainEntityOfPage": {
"@type": "WebPage",
"@id": "https://yourwebsite.com/blog/schema-in-webflow"
}
}
</script>

  1. Add the schema code to Webflow - You can manually add the schema to Webflow using the custom code settings.For a single page:
    • Open Webflow Designer.
    • Go to the Page Settings for the desired page.
    • Scroll to the Custom Code section.
    • Paste your JSON-LD code inside the "Before </body>" or "Inside <head>" fields.
    • Publish your website

Option B: For CMS (dynamic pages)

  • If you are using a CMS collection (such as blog posts):
  • Go to your CMS template page → Page Settings → Custom Code.
  • Paste the schema, but replace the text values ​​with the Webflow CMS fields.
  • Example (dynamic version):
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Blog Post",
"headline": "{{wf {&quot;path&quot;:&quot;name&quot;,&quot;type&quot;:&quot;PlainText&quot;} }}",
"description": "{{wf {&quot;path&quot;:&quot;summary&quot;,&quot;type&quot;:&quot;PlainText&quot;} }}",
"author": {
"@type": "Person",
"name": "Bojana Đaković"
},
"datePublished": "{{wf {&quot;path&quot;:&quot;publish-date&quot;,&quot;type&quot;:&quot;Date&quot;} }}",
"mainEntityOfPage": {
"@type": "WebPage",
"@id": "{{wf {&quot;path&quot;:&quot;slug&quot;,&quot;type&quot;:&quot;PlainText&quot;} }}"
}
}
</script>

This way, each blog post automatically generates unique structured data from your CMS fields.

  1. Validate your schema - Before publishing, make sure Google can read your schema correctly.Use one of these free tools:
    • Google Rich Results Test
    • Schema Markup Validator
    • Simply enter your page URL or paste the code, and the tool will show you any errors or warnings.
  2. Add a global schema (optional)-For organization-wide data, you can include a global schema across your entire website.
    • Go to Project Settings → Custom Code → Inside the <head> Tag.
    • Paste your global schema (such as your company information).
    • Publish your web page.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "Webflow Agency",
"url": "https://yourwebsite.com",
"logo": "https://yourwebsite.com/logo.png",
"sameAs": [
"https://www.instagram.com/yourprofile",
"https://www.linkedin.com/company/yourcompany"
]
}
</script>

Implementing structured data in Webflow without plugins is surprisingly easy and gives you complete control over your SEO strategy.

By manually adding JSON-LD markup, you help Google better understand your content, improve how your pages appear in search, and increase your chances of earning rich snippets.

If you run a blog or business website on Webflow, taking the time to set up schema now is one of the easiest and most effective SEO upgrades you can make.

Back to blog page