for a Blog

Creating a blog is a fun way to share what you learn and grow a following through organic traffic.

Providing can help improve your search appearance click-throughs rates by helping Google optimise how your site is shown.

Marking up an Article

The defineArticle function and SchemaOrgArticle component are provided to create Article Schema whilst handling relations for you.

Note that some fields may already be inferred, see Route Meta Resolving

Composition API
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),  })])
Component API
<template>  <SchemaOrgArticle     image="/photos/16x9/photo.jpg"    :date-published="new Date(2020, 1, 1)"    :date-modified="new Date(2020, 1, 1)"   /></template>

Specifying 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.

Composition API
useSchemaOrg([  defineArticle({    '@type': 'BlogPosting',    // ...  })])
Component API
<template>  <SchemaOrgArticle     type="BlogPosting"   /></template>

See the Article Types for the list of available types.

Providing 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.

Composition API
useSchemaOrg([  defineArticle({    headline: 'My Article',    author: [      {        name: 'John doe',        url: '',      },      {        name: 'Jane doe',        url: '',      },    ]  })])
Component API
<template>  <SchemaOrgArticle     headline="My Article"   />  <SchemaOrgPerson name="John doe" url="" />  <SchemaOrgPerson name="Jane doe" url="" /> </template>

Markup 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.

Composition API
useSchemaOrg([  defineWebPage({    '@type': 'CollectionPage'  }),])
Component API
<template>  <SchemaOrgWebPage     type="CollectionPage"   /></template>