How AI is powering better personalization in e-commerce [with Vercel]. Sign up now →

Sanity SEO Fields Plugin

The Sanity SEO Fields Plugin makes SEO simple and accessible, helping teams and creators implement web-standard, social-ready content with ease. It bridges complex SEO needs and content creation, boosting visibility, engagement, and best-practice adoption across the community.

By Desai Hardik

Install command

npm i sanity-plugin-seofields

šŸ” Sanity SEO Fields Plugin

npm version npm downloads license GitHub stars

A Sanity Studio (v3/v4/v5) plugin to manage SEO fields — meta tags, Open Graph, Twitter Cards, robots directives, and structured data.

šŸ“– Full Documentation →


Installation

npm install sanity-plugin-seofields

Quick Start

1. Register the plugin

// sanity.config.ts
import {defineConfig} from 'sanity'
import seofields from 'sanity-plugin-seofields'

export default defineConfig({
  plugins: [seofields()],
})

2. Add SEO fields to a document

import {defineField, defineType} from 'sanity'

export default defineType({
  name: 'page',
  type: 'document',
  fields: [
    defineField({name: 'title', type: 'string'}),
    defineField({name: 'seo', type: 'seoFields'}),
  ],
})

That's it. The seoFields type is automatically registered by the plugin.


Available Schema Types

TypeDescription
seoFieldsComplete SEO bundle (recommended)
openGraphOpen Graph tags for social sharing
twitterX (Twitter) Card settings
metaTagContainer for custom meta attributes
metaAttributeSingle key/value meta attribute
robotsnoindex / nofollow directives

Configuration

seofields({
  seoPreview: true,
  fieldOverrides: {
    title: {title: 'Page Title'},
  },
  defaultHiddenFields: ['openGraphSiteName', 'twitterSite'],
  fieldVisibility: {
    post: {hiddenFields: ['twitterSite']},
  },
})
OptionTypeDefaultDescription
seoPreviewbooleantrueEnable/disable live SEO preview
fieldOverridesobject{}Customize field titles and descriptions
defaultHiddenFieldsarray[]Hide sitewide fields globally
fieldVisibilityobject{}Hide fields per document type

→ Full configuration reference


SEO Health Dashboard

An optional Studio tool that scores SEO completeness across all documents, highlights missing fields, and links directly to documents.

Requires a free license key — get yours here.

seofields({
  dashboard: {
    enabled: true,
    licenseKey: process.env.SANITY_STUDIO_SEO_LICENSE_KEY,
  },
})

→ Dashboard docs


Schema.org / JSON-LD

The plugin ships 38 Schema.org types as Sanity schema definitions + React components that render <script type="application/ld+json"> tags.

1. Register schema types in Studio

// sanity.config.ts
import {schemaOrg} from 'sanity-plugin-seofields/schema'

export default defineConfig({
  plugins: [seofields(), schemaOrg()], // all 38 types at once
})

Or register only what you need:

import {schemaOrgArticlePlugin, schemaOrgOrganizationPlugin} from 'sanity-plugin-seofields/schema'

export default defineConfig({
  plugins: [seofields(), schemaOrgArticlePlugin(), schemaOrgOrganizationPlugin()],
})

2. Add to a document schema

defineField({name: 'schemaOrg', type: 'schemaOrg'}) // combined array field
// or individual types:
defineField({name: 'article', type: 'schemaOrgArticle'})

3. Render in Next.js

// Combined renderer
import {SchemaOrgScripts} from 'sanity-plugin-seofields/schema/next'

export default function Layout({data}) {
  return <SchemaOrgScripts items={data.schemaOrg} />
}

// Or individual components
import {ArticleSchema, OrganizationSchema} from 'sanity-plugin-seofields/schema/next'

export default function Page({data}) {
  return (
    <>
      <ArticleSchema data={data.article} />
      <OrganizationSchema data={data.org} />
    </>
  )
}

All 38 available types: AggregateRating, Article, BlogPosting, Book, Brand, BreadcrumbList, ContactPoint, Country, Course, Event, FAQPage, HowTo, ImageObject, ItemList, JobPosting, LegalService, LocalBusiness, Movie, MusicAlbum, MusicRecording, NewsArticle, Offer, Organization, Person, Place, PostalAddress, Product, ProfilePage, Recipe, Restaurant, Review, Service, SocialMediaPosting, SoftwareApplication, VideoObject, WebApplication, WebPage, Website.

→ Schema.org docs


Next.js Integration

import {buildSeoMeta, SeoMetaTags} from 'sanity-plugin-seofields/next'

→ Next.js integration guide


CLI

npx seofields

→ CLI docs


Contributing

PRs and issues are welcome. See CONTRIBUTING.md.

License

MIT

Related contributions