docs

Meta Tags Preview

The Meta Tags Preview renders the exact HTML <head> output — title, description, Open Graph tags, Twitter Card tags, robots, canonical URL, and custom meta attributes — live inside Sanity Studio as editors fill in the fields. No need to publish and view source.

What it renders

—<title> — meta title
—<meta name="description"> — meta description
—<meta name="keywords"> — when keywords are set
—<meta name="robots"> — robots directives
—<link rel="canonical"> — canonical URL
—og:title, og:description, og:url, og:type, og:site_name, og:image
—twitter:card, twitter:site, twitter:creator, twitter:title, twitter:description, twitter:image
—hreflang <link rel="alternate"> entries
—Custom metaAttributes key/value pairs

Enabling & Disabling

The Meta Tags Preview is shown by default. Disable it with the metaTagsPreview plugin option:

sanity.config.ts — disable preview

import seofields from 'sanity-plugin-seofields'
import { defineConfig } from 'sanity'

export default defineConfig({
  plugins: [
    seofields({
      metaTagsPreview: false,   // hides the preview panel on all document types
    }),
  ],
})

Hide it only on specific document types via fieldVisibility:

sanity.config.ts — hide per document type

seofields({
  fieldVisibility: {
    internalPage: { hiddenFields: ['metaTagsPreview'] },
  },
})

Using with Field Groups

When using field groups you must explicitly assign metaTagsPreview to a group — fields not assigned to any group appear in all tabs:

sanity.config.ts

seofields({
  fieldGroups: [
    {
      name: 'meta',
      title: 'Meta',
      default: true,
      fields: [
        'title',
        'description',
        'focusKeyword',
        'metaImage',
        'keywords',
        'canonicalUrl',
        'robots',
        'metaAttributes',
        'metaTagsPreview',   // ← show preview on this tab
      ],
    },
    { name: 'openGraph', title: 'Open Graph',   fields: ['openGraph'] },
    { name: 'twitter',   title: 'Twitter Card', fields: ['twitter'] },
    { name: 'geo',       title: 'GEO / AI',     fields: ['geoChecklist'] },
  ],
})

Image resolution

The preview resolves uploaded Sanity images to their CDN URL using the project's projectId and dataset from the active Studio client. External image URLs (when imageType is 'url') are shown as-is. No additional configuration is required.

Tip: The Meta Tags Preview and the SEO Preview (SERP snippet) serve different purposes. The SEO Preview shows a Google-style search result card; the Meta Tags Preview shows the raw HTML that will be in the page source. Use both together for complete coverage.

Was this page helpful?