sanity-plugin-seofields

The complete SEO toolkit for Sanity Studio.

Manage SEO fields, social previews, robots directives, canonical URLs, Schema.org JSON-LD, and studio-wide SEO health checks — directly inside Sanity Studio v3, v4, or v5.

Documentation  •  Quick Start  •  Configuration  •  Schema.org  •  CLI

Why This Plugin

Most Sanity SEO plugins stop at title and description fields. sanity-plugin-seofields gives editors and developers a full SEO workflow — from per-document fields all the way to studio-wide audits.

Use it as a simple field plugin, a structured data system, or a complete SEO operations layer for your Sanity projects.

Table of Contents

• Features
• Installation
• Quick Start
• Registered Schema Types
• Configuration
• SEO Health Dashboard
• Schema.org Structured Data
• Next.js & React Exports
• CLI
• Package Exports
• Compatibility
• Contributing
• License

Features

Installation

npm install sanity-plugin-seofields

Peer dependencies:

sanity   ^3 || ^4 || ^5
react    ^18 || ^19

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

// schemas/page.ts
import {defineField, defineType} from 'sanity'

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

The seoFields type is registered automatically by the plugin.

3. Render SEO Metadata in Next.js

// app/[slug]/page.tsx
import type {Metadata} from 'next'
import {buildSeoMeta} from 'sanity-plugin-seofields/next'

export async function generateMetadata(): Promise<Metadata> {
  const page = await getPage()

  return buildSeoMeta({
    seo: page.seo,
    baseUrl: 'https://example.com',
    path: `/pages/${page.slug}`,
    defaults: {
      title: page.title,
      description: 'Default site description',
    },
  })
}

Full guide: Frontend integration

Registered Schema Types

Configuration

import seofields from 'sanity-plugin-seofields'

seofields({
  seoPreview: true,
  fieldOverrides: {
    title: {
      title: 'Meta Title',
      description: 'Recommended length: 50-60 characters.',
    },
  },
  defaultHiddenFields: ['twitterSite'],
  fieldVisibility: {
    post: {
      hiddenFields: ['openGraphSiteName'],
    },
  },
  dashboard: {
    enabled: true,
    licenseKey: process.env.SANITY_STUDIO_SEO_LICENSE_KEY,
  },
})

Full reference: Configuration docs

SEO Health Dashboard

The dashboard is a Studio tool that helps teams find SEO gaps before they ship content.

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

export default defineConfig({
  plugins: [
    seofields({
      dashboard: {
        enabled: true,
        licenseKey: process.env.SANITY_STUDIO_SEO_LICENSE_KEY,
        query: {
          types: ['page', 'post', 'product'],
        },
        export: {
          enabled: true,
          formats: ['csv', 'json'],
        },
      },
    }),
  ],
})

Dashboard capabilities:

• Audit all configured document types
• View SEO score, status, and missing fields
• Filter documents by score and document type
• Export reports as CSV or JSON
• Open the exact document that needs updates
• Customize document title, subtitle, and preview display

Get a dashboard license: Get license

Dashboard docs: SEO Health Dashboard

Schema.org Structured Data

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

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

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

export default defineConfig({
  plugins: [
    schemaOrgArticlePlugin(),
    schemaOrgFAQPagePlugin(),
    schemaOrgProductPlugin(),
  ],
})

import {defineField, defineType} from 'sanity'

export default defineType({
  name: 'article',
  type: 'document',
  fields: [
    defineField({
      name: 'schemaOrg',
      title: 'Structured Data',
      type: 'schemaOrg',
    }),
  ],
})

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

export function Page({page}: {page: PageData}) {
  return <SchemaOrgScripts items={page.schemaOrg} />
}

import {
  ArticleSchema,
  FAQPageSchema,
  ProductSchema,
} from 'sanity-plugin-seofields/schema/next'

export function Page({page}: {page: PageData}) {
  return (
    <>
      <ArticleSchema data={page.articleSchema} />
      <FAQPageSchema data={page.faqSchema} />
      <ProductSchema data={page.productSchema} />
    </>
  )
}

Available Schema.org types (38)

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: Structured data guide

Next.js & React Exports

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

Common usage:

• Use buildSeoMeta() in Next.js App Router generateMetadata()
• Use <SeoMetaTags /> in React layouts or frameworks where you control the <head>
• Use SchemaOrgScripts or individual schema components for JSON-LD
• Pass an imageUrlResolver when your Sanity image data needs URL building

Docs: Frontend integration

CLI

Run the CLI:

npx seofields

Useful commands:

npx seofields init                                          # Guided setup
npx seofields doctor                                        # Diagnostics
npx seofields report                                        # SEO data report
npx seofields export --format json --output seo-report.json # JSON export
npx seofields export --format csv  --output seo-report.csv  # CSV export

CLI docs: CLI guide

Package Exports

Compatibility

Contributing

Issues and pull requests are welcome.

• GitHub repository
• Open an issue
• Contributing guide

If the plugin helps your project, consider leaving a star on the GitHub repo, a review on the docs site, or a rating in the Sanity Plugin Directory.

License

MIT © Hardik Desai