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
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 '#imports'
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 '#imports'
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 '#imports'
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 '#imports'
useSchemaOrg([
defineWebPage({
'@type': 'CollectionPage'
}),
])
Related Recipes
- Setting Up Your Identity - Define your organization/person
- Breadcrumbs - Add navigation breadcrumbs
- FAQ Page - Add FAQ structured data