Skip to content
thehardik

Featured package

sanity-plugin-seofields

The complete SEO toolkit for Sanity Studio. SEO fields, social metadata, Schema.org JSON-LD, AI-generated copy and an SEO health dashboard — inside Sanity Studio, with render helpers for Next.js, Astro, Nuxt, SvelteKit and Remix.

versionv1.12.0licenseMITdownloads6.1k/mosanityv3–v6
Read the docs GitHub npm

Overview#

Editors get SEO fields, live previews and a score while they write; developers get typed helpers to render it all.

An impression of the SEO tab in Sanity Studio: score, Google preview and checks.

Quick start#

Four steps, five minutes.

  1. Install

    One package. Peer deps are Sanity v3–v6, React 18/19 and @sanity/icons.

    npm install sanity-plugin-seofields

  2. Register

    Add seofields() to the plugins array in sanity.config.ts.

  3. Add the field

    Drop a field of type seoFields into any document schema.

  4. Render

    Map it to <head> with buildSeoMeta() in the App Router, or buildSeoHead() elsewhere.

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

export async function generateMetadata() {
  const page = await getPage()
  return buildSeoMeta({
    seo: page.seo,
    path: `/${page.slug}`,
  })
}

Features#

Everything the plugin adds to Studio and to your front end.

01One field, full coverage
A single seoFields type: title, description, canonical, keywords, robots, Open Graph, X/Twitter, hreflang and custom meta tags.
02Live SERP preview
Editors see the Google result and social cards while they type, with character counters and focus-keyword checks.
03Schema.org JSON-LD
Structured-data types for BlogPosting, FAQ, Breadcrumbs and more, plus React / Next.js helpers to render them.
04AI-assisted copy
Generate titles and descriptions from the document body, through a server-side proxy so keys never reach the browser.
05SEO health dashboard
Audit every document from one pane, score it, and export the report as CSV or JSON. A publish gate can warn below a score.
06Framework-neutral head
buildSeoMeta() for the Next.js App Router, buildSeoHead() for Astro, Nuxt, Vue, SvelteKit, Remix and custom renderers. Plus a CLI.

Further reading#

Read the 5-minute guideThe walkthrough on the blog covers GROQ, Open Graph images and JSON-LD.Plugin documentationThe full reference, on the plugin's own docs site.

Package info#

PropertyValue
Latest versionv1.12.0
Downloads / month6.1k
Sanity Studiov3 → v6
LicenseMIT
Repositorygithub.com/hardik-143/sanity-plugin-seofields
Documentationsanity-plugin-seofields.thehardik.in/docs

The Build Log

New posts, plugin releases, and the Sanity + Next.js tricks that didn't fit in a blog post. About once a month.