Schema.org for a Blog

Use defineArticle() with @type: 'BlogPosting' to mark up blog posts. This enables rich snippets showing author, publish date, and article images in search results.

Useful Links

• Article | Google Search Central
• Article Schema | Yoast

How do I mark up a blog article?

The defineArticle function is provided to create Article Schema whilst handling relations for you.

Note that some fields may already be inferred, see Schema.org Params

import { defineArticle, useSchemaOrg } from '@unhead/schema-org/typescript'

useSchemaOrg([
  defineArticle({
    // name and description can usually be inferred
    image: '/photos/16x9/photo.jpg',
    datePublished: new Date(2020, 1, 1),
    dateModified: new Date(2020, 1, 1),
  })
])

How do I specify the article type?

Providing a type of Article can help clarify what kind of content the page is about.

The most common types are: BlogPosting and NewsArticle.

import { defineArticle, useSchemaOrg } from '@unhead/schema-org/typescript'

useSchemaOrg([
  defineArticle({
    '@type': 'BlogPosting',
    // ...
  })
])

See the Article Types for the list of available types.

How do I add an author?

If the author of the article isn't the site identity, then you'll need to config the author or authors.

When defining a Person when an Article is present, it will automatically associate them as the author.

import { defineArticle, useSchemaOrg } from '@unhead/schema-org/typescript'

useSchemaOrg([
  defineArticle({
    headline: 'My Article',
    author: [
      {
        name: 'John doe',
        url: 'https://johndoe.com',
      },
      {
        name: 'Jane doe',
        url: 'https://janedoe.com',
      },
    ]
  })
])

How do I mark up blog archive pages?

Assuming you have the WebPage and WebSite schema loaded in from a parent layout component, you can augment the WebPage type to better indicate the purpose of the page.

See CollectionPage for more information.

import { defineWebPage, useSchemaOrg } from '@unhead/schema-org/typescript'

useSchemaOrg([
  defineWebPage({
    '@type': 'CollectionPage'
  }),
])

Related Recipes

• Setting Up Your Identity - Define your organization/person
• Breadcrumbs - Add navigation breadcrumbs
• FAQ Page - Add FAQ structured data