docs

WebPage

The WebPage schema type represents a single page on a website. It helps search engines understand the page's content, language, and relationship to the parent site.

About WebPage

WebPage markup connects individual pages to their parent WebSite entity, creating a clear hierarchy for search engines. This is especially useful for AI-powered search (AEO) and generative search (GEO), where understanding page context and relationships matters. Use it alongside WebSite schema to give search engines the full picture of your site structure. Google can also use this to display enhanced breadcrumbs and page metadata in results.

Fields

Field	Type	Required	Description
`name`	string	✓	The title of the web page as it should appear in search results.
`url`	string	✓	The canonical URL of this specific page.
`description`	string	—	A short summary of the page content for search engines and AI assistants.
`inLanguage`	string	—	The language of the page content (e.g. en, es, fr).
`isPartOf.url`	string	—	The URL of the parent WebSite this page belongs to, establishing site hierarchy.

Plugin Registration

sanity.config.ts

import { defineConfig } from 'sanity'
import { schemaOrgWebPagePlugin } from 'sanity-plugin-seofields/schema'

export default defineConfig({
  // ... your sanity config
  plugins: [
    schemaOrgWebPagePlugin(),
  ],
})

Schema Usage

Add theschemaOrgWebPage field to any document schema:

schemas/page.ts

import { defineField, defineType } from 'sanity'

export default defineType({
  name: 'page',
  title: 'Page',
  type: 'document',
  fields: [
    // ... your other fields
    defineField({
      name: 'schemaOrgWebPage',
      title: 'WebPage Schema',
      type: 'schemaOrgWebPage',
    }),
  ],
})

GROQ Query

GROQ query

*[_type == "yourDocument"][0]{
  schemaOrgWebPage {
    name,
    url,
    description,
    inLanguage,
    isPartOf {
      url
    }
  }
}

Next.js Component

app/layout.tsx

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

export default function Layout({ data }) {
  return <WebPageSchema data={data.schemaOrgWebPage} />
}

JSON-LD Output

Generated JSON-LD

{
  "@context": "https://schema.org",
  "@type": "WebPage",
  "name": "About Us",
  "url": "https://example.com/about",
  "description": "Learn more about our team and mission.",
  "inLanguage": "en",
  "isPartOf": {
    "@type": "WebSite",
    "url": "https://example.com"
  }
}

03 / 24

←

Organization

Person

→

{schema.org}

Was this page helpful?