Demo

Install

yarn add -D nuxt-schema-org

npm install -D nuxt-schema-org

pnpm add -D nuxt-schema-org

Setup Module

1. Add Module

Add the module to your Nuxt config.

export default defineNuxtConfig({  modules: [    'nuxt-schema-org',  ],})

2. Configure the module

To server-side render Schema.org, you'll need to provide a canonical host.

export default defineNuxtConfig({  // ...  schemaOrg: {    canonicalHost: 'https://example.com',  },})

You can conditionally swap this depending on the environment, but it's not needed, simply putting the production host is enough.

See the User Config page for all options you can pass on schemaOrg.

3. Recommended: Add Site Schema.org

To quickly add the recommended Schema.org to all pages, you can make use Runtime Inferences.

This should be done in either your app.vue or layout/default.vue file.

<script lang="ts" setup>useSchemaOrg([  // @todo Select Identity: https://vue-schema-org.netlify.app/guide/guides/identity  defineWebSite({    name: 'My Awesome Website',  }),  defineWebPage(),])</script>

<template>  <!-- @todo Select Identity: https://vue-schema-org.netlify.app/guide/guides/identity -->  <SchemaOrgWebSite name="My Awesome Website" />  <SchemaOrgWebPage /></template>

Next Steps

Your Nuxt app is now serving basic Schema.org, congrats! 🎉

The next steps are:

1. Choose an Identity
2. Set up your pages for Runtime Inferences
3. Then feel free to follow some recipes:

• Breadcrumbs
• FAQ Page
• Site Search

Module Options

All module options can be passed on the schemaOrg key in your nuxt.config.ts.

See User Config for config options.

NuxtApp Hooks

• schema-org:meta: (meta: MetaInput) => void

You can hook into the generation of the meta-data used to generate the Schema.org data.

For example, this can be useful for dynamically changing the host.

import { defineNuxtPlugin } from '#app'export default defineNuxtPlugin((nuxtApp) => {  nuxtApp.hooks.hook('schema-org:meta', (meta) => {    if (nuxtApp._route.path === '/plugin-override') {      meta.host = 'https://override-example.com'      meta.url = `${meta.host}${meta.path}`    }  })})