Webflow CMS

How to Set Up Per-Post SEO Meta Titles and Descriptions in Webflow CMS

TS Talha Shahzad··5 min read
The short version
  • Missing or generic meta tags prevent dynamic CMS pages from ranking in search results.
  • Webflow allows you to dynamically bind meta titles and descriptions directly to fields inside your CMS collection.
  • Creating dedicated SEO override fields gives you complete control over your search snippets.
  • Dynamic Open Graph settings automate the generation of social sharing cards for every post.
  • Proper canonical URL handling ensures search engines index the primary version of your CMS content.

Many companies publish dozens of blog posts to their Webflow site only to wonder why their articles do not show up on Google. When you audit their site, the reason is almost always the same: their dynamic pages have missing or generic metadata. They are using the same default title for every single article, leaving search engine crawlers with no unique signals to index.

To set SEO titles for each Webflow blog post, you must use dynamic binding in your Collection Page settings. By linking your page's meta title and meta description fields to specific CMS fields, you can automate your SEO metadata while retaining the flexibility to write custom overrides for individual posts.

After 450+ builds, I have seen how a simple fix to meta tags can revive dormant organic traffic. Let's walk through the step-by-step process of setting up dynamic SEO settings for your Webflow CMS collection.

Why default settings kill your search visibility

When you create a new CMS collection page in Webflow, the SEO settings are blank. If you publish the page without configuring these settings, search engines will scrape whatever they can find, which is usually just the H1 title of the page and the first paragraph of content.

This is a problem for two reasons:

  1. Lack of Keyword Control: An article title designed to engage a human reader is rarely identical to the search query they type into a search bar. Your meta title needs to contain your primary target keyword, ideally placed near the beginning.
  2. Snippet Truncation: Google search results truncate meta titles at around 60 characters and meta descriptions at around 160 characters. If you let search engines pull random paragraphs from your post, your listing will look unprofessional and unfinished, which lowers your click-through rates.

To prevent this, you need to map out your metadata dynamically within the collection settings.

Setting up your CMS collection for custom SEO overrides

Before configuring the page templates, you need to prepare your collection fields. While you can use the default post title as the meta title, it is always a best practice to create dedicated SEO fields. This allows you to write specific, character-limited titles and descriptions for search results without altering the visible headings on your website.

Open your Blog Posts collection settings and add the following fields:

  • SEO Title: Plain text field (Label it "SEO Title: 50 to 60 characters").
  • SEO Description: Plain text field (Label it "SEO Description: 140 to 160 characters").
  • OG Image: Image field (optimized for social sharing, typically 1200 by 630 pixels).

By defining these as separate fields, your editorial team can craft optimized snippets for Google while keeping the homepage and article headers styled for human engagement.

Want a website that turns visitors into customers, not just compliments?

Book a 15-min intro

Binding meta settings to CMS fields

Once your fields are set up, you need to bind them to your collection template page settings.

  1. Open the Pages panel in the Webflow designer.
  2. Find your Blog Posts template page and click the gear icon to open the Page Settings.
  3. Scroll down to the SEO Settings section.
  4. In the Meta Title field, click the purple "+ Add Field" button in the top-right corner.
  5. Select your SEO Title field from the dropdown menu. If you want to add static branding, you can write: {{SEO Title}} | Brand Name. If your SEO Title field is blank for a post, Webflow will automatically fallback to the standard Post Title.
  6. In the Meta Description field, click "+ Add Field" and select your SEO Description field.
  7. Scroll down to the Open Graph Settings section.
  8. Check the box to use your SEO settings as the Open Graph settings. This ensures your social sharing titles and descriptions match your search engine tags.
  9. In the Open Graph Image URL field, click "+ Add Field" and select your OG Image field. If you do not have a dedicated social image, you can bind this to your main blog post thumbnail.

By binding these settings, you establish a template. When you publish a new article, Webflow reads the CMS data and automatically generates the appropriate HTML tags behind the scenes.

Setting up canonical tags for dynamic pages

A final, critical step for dynamic SEO is setting up canonical tags. When your site has multiple paths to the same content, such as category archive pages or parameterized URLs from search filtering, search engines can get confused about which version of the page is the primary one.

A canonical tag tells search engines which URL is the official master copy. Webflow has a built-in Global Canonical Tag setting that combines your base URL with each page's slug to generate a self-referencing canonical on every page, including CMS posts.

  1. Go to your Webflow Project Settings.
  2. Navigate to the SEO tab.
  3. Scroll down to the Global Canonical Tag section.
  4. Input your primary domain, including the protocol and no trailing slash (e.g., https://www.yourdomain.com). If your default domain uses www, include it here.

Webflow will automatically generate a <link rel="canonical" href="https://www.yourdomain.com/blog/post-slug"> tag in the head of every page on your site, including all CMS posts. This prevents duplicate content penalties and consolidates your authority onto your primary URLs.

Optimizing your dynamic pages is about building systems that prevent human error. By structuring your CMS to include dedicated SEO fields, binding those fields to your collection templates, and ensuring your canonical paths are properly configured, you guarantee that every article you write launches with its search metadata fully optimized.

Prefer to hire through Upwork?
Top Rated Plus, 100% Job Success, 450+ projects shipped. See the reviews and start a contract.
Hire me on Upwork

FAQ

What happens if I do not set meta titles for my CMS pages?

If you leave the meta settings blank, Webflow defaults to using the page name. While this is better than nothing, it is rarely optimized for search keywords, which can severely limit your search engine rankings.

Can I use formulas to auto-generate meta titles in Webflow?

Yes. In the collection page settings, you can combine static text with dynamic fields. For example, you can write: '[Post Title] | My Brand Name' by mixing text and a dynamic field binding.

What is the character limit for meta titles and descriptions?

Aim to keep meta titles between 50 to 60 characters and meta descriptions between 140 to 160 characters. Text exceeding these limits will be truncated by search engine result pages.

How do I set up dynamic Open Graph images?

In your collection page settings, go to the Open Graph Image section and select your main blog image or post thumbnail field. Webflow will automatically use this image when the link is shared on social media.

All posts
the next step is small

Want a site that does this for you?

15 minutes, no deck, no pressure. Worst case, you leave with a free plan.

keep reading

More notes