Articles, News & Blog Post JSON-LD

Google support three types of "long-format" content, typed as _Article, _NewsArticle, or _BlogPosting.

In this example we'll use _BlogPosting but the same rules apply to all.

STEP 1

On your Blog Post Collection page;

Drop an HTML Embed on the page and paste in this code.

<script type="application/ld+json">
{  
  "@context": "http://schema.org",  
  "@type": "BlogPosting", 
  "headline": "{{ Blog Post Title }}", 
  "image": "{{ Post Image }}",  
  "genre": "{{ Post Genre }}",   
  "mainEntityOfPage": {     
    "@type": "WebPage",      
    "@id": "https://www.mybaseUrl.uk/post/{{ Post Slug }}" 
  }, 
  "publisher": {  
    "@type": "Organization",   
    "name": "My Company Name",   
    "email": "[email protected]",   
    "address": "My Company Full Address",   
    "logo": {      
      "@type": "ImageObject",      
      "url": "https://assets-global.website-files.com/company-logo.png"    
    } 
  }, 
  "url": "/{{ Slug }}", 
  "datePublished": "{{ Post Published Date }}", 
  "dateCreated": "{{ Post Created Date }}", 
  "dateModified": "{{ Post Modified Date }}", 
  "description": "{{ Post Description }}",   
  "author": {    
    "@type": "Person",    
    "name": "{{ Author Name }}"  
  } 
}
</script>

Note the _{{{ Field }}} names, which represent Webflow's CMS field embeds.

STEP 2

Re-bind each of your CMS fields to your blog post fields.

STEP 3

Update the static info in the JSON;

• Company name, address, and email
• Company logo ( pull the link from your Webflow collection )
• The front part of the URL under _{mainEntityOfPage.@id}
• Author name if it's always the same person and you don't have an Author field on your Blog posts.

etc.

STEP 4

Publish, and test;

https://developers.google.com/search/docs/advanced/structured-data

STEP 5 ( Optional )

Change the main article _<div> element to an _<article> element, under element settings.

Notes

The articleBody property is not used here for 3 reasons;

• Google doesn't support it
• Webflow does not support embedding rich text fields, or converting them to plaintext
• The JSON-LD spec requires a plain text version
• Webflow doesn't JSON encode its embedded fields which - for long-form content expecially - adds significant invalidation risk.

References

Ezra's post in the Webflow forums.

Google's Structured Data docs

Other JSON-LD examples

‍

‍