Nuxt SEO is a collection of 6 modules. Most work out-of-the-box, but some configuration may be needed depending on your site.
Check out the StackBlitz Demo for a working example.
Generates a sitemap at /sitemap.xml so search engines can discover your pages.
npx nuxi module add @nuxtjs/sitemap
Default behavior:
lastmod when availablerobots.txtexport default defineNuxtConfig({
sitemap: {
// fetch URLs from an API endpoint
sources: ['/api/__sitemap__/urls']
}
})
export default defineNuxtConfig({
sitemap: {
// auto-configured when i18n detected
// creates /en-sitemap.xml, /fr-sitemap.xml, etc.
}
})
---
# content/blog/my-post.md
sitemap:
lastmod: 2024-01-15
changefreq: weekly
priority: 0.8
---
See the Sitemap documentation for all options.
Controls search engine crawling via robots.txt, meta tags, and HTTP headers.
npx nuxi module add @nuxtjs/robots
Default behavior:
/robots.txt allowing all routes<meta name="robots"> and X-Robots-Tag header# public/_robots.txt (recommended)
User-agent: *
Allow: /
Disallow: /admin
User-agent: GPTBot
Disallow: /
export default defineNuxtConfig({
robots: {
disallow: ['/admin', '/private'],
groups: [
{ userAgent: ['GPTBot', 'ChatGPT-User'], disallow: ['/'] }
]
}
})
export default defineNuxtConfig({
robots: {
// auto-prefixes rules with locale
// /admin -> /en/admin, /fr/admin
disallow: ['/admin']
}
})
---
# content/internal/secret.md
robots: noindex, nofollow
---
See the Robots documentation for all options.
Generates dynamic Open Graph images for social sharing.
npx nuxi module add nuxt-og-image
Default behavior:
export default defineNuxtConfig({
ogImage: {
defaults: {
component: 'OgImageTemplate',
// pass props to your template
title: 'My Site'
}
}
})
export default defineNuxtConfig({
ogImage: {
fonts: ['Inter:400', 'Inter:700'],
// prerender all images at build
runtimeBrowser: false
}
})
---
# content/blog/my-post.md
title: My Blog Post
description: A great article
ogImage:
component: OgImageBlog
props:
author: John Doe
---
See the OG Image documentation for all options.
Adds structured data (JSON-LD) for rich search results.
npx nuxi module add nuxt-schema-org
Default behavior:
WebSite and WebPage schema automaticallyexport default defineNuxtConfig({
schemaOrg: {
identity: {
type: 'Organization',
name: 'My Company',
logo: '/logo.png',
sameAs: ['https://twitter.com/mycompany']
}
}
})
export default defineNuxtConfig({
schemaOrg: {
identity: {
type: 'Person',
name: 'John Doe',
image: '/avatar.jpg',
url: 'https://johndoe.com'
}
}
})
---
# content/blog/my-post.md
title: My Blog Post
description: A great article
author: John Doe
datePublished: 2024-01-15
dateModified: 2024-02-01
---
See the Schema.org documentation for all options.
Finds broken links before they hurt your SEO.
npx nuxi module add nuxt-link-checker
Default behavior:
export default defineNuxtConfig({
linkChecker: {
failOnError: true,
// generate reports
report: {
html: true,
markdown: true
}
}
})
export default defineNuxtConfig({
linkChecker: {
skipInspections: [
'external-if-timeout',
'missing-hash'
],
// exclude paths from checking
excludeLinks: ['/api/**']
}
})
See the Link Checker documentation for all options.
Extra SEO utilities: breadcrumbs, default meta, file metadata.
npx nuxi module add nuxt-seo-utils
Default behavior:
favicon.ico, apple-touch-icon.png in public foldersite.name for missing page titlesuseBreadcrumbs() composableexport default defineNuxtConfig({
routeRules: {
'/blog/**': {
seoMeta: {
ogType: 'article'
}
},
'/products/**': {
seoMeta: {
ogType: 'product'
}
}
}
})
export default defineNuxtConfig({
seoUtils: {
automaticBreadcrumbs: true
}
// adds Schema.org BreadcrumbList automatically
})
See the SEO Utils documentation for all options.
Central config shared across all SEO modules. Set once, used everywhere.
Default behavior:
NUXT_SITE_URL env varexport default defineNuxtConfig({
site: {
url: 'https://example.com',
name: 'My Site',
description: 'Welcome to my site',
defaultLocale: 'en'
}
})
export default defineNuxtConfig({
site: {
multiTenancy: [
{
hosts: ['example.com', 'www.example.com'],
config: { name: 'Example', url: 'https://example.com' }
},
{
hosts: ['foo.com', 'www.foo.com'],
config: { name: 'Foo', url: 'https://foo.com' }
}
]
}
})
export default defineNuxtConfig({
site: {
// auto-syncs with i18n locale
// url and name update per locale
}
})
See the Site Config documentation for all options.