Skip to main content
View as Markdown

SEO & Metadata

The page-level meta property controls everything rendered into the document <head>: the title and description, social-sharing cards, structured data, favicons, and performance hints. Metadata supports $record.* and $frontmatter.* substitution, so collection and markdown pages produce per-record SEO automatically.

pages:
  - name: Blog Post
    path: /blog/:slug
    collection: { table: posts, slugField: slug }
    meta:
      title: '$record.title'
      description: '$record.excerpt'
      openGraph: { type: article, image: '$record.cover' }
      twitter: { card: summary_large_image }

Core Metadata

Property Description
title Page title for the browser tab and SEO (max ~60 chars for optimal display).
description Page description for SEO and social sharing (max ~160 chars).
keywords Comma-separated SEO keywords.
author Page author or organization name.
canonical Canonical URL to prevent duplicate-content issues.
robots Robot directives (e.g. noindex, nofollow).
noindex Shorthand for robots: noindex — prevents indexing by search engines.
lang Page language code (ISO 639-1 with optional country; auto-detected when omitted).
image Default social-sharing image (shorthand also feeding Open Graph/Twitter).
siteName Site name (shorthand for openGraph.siteName).
stylesheet Path to the main stylesheet.
googleFonts Google Fonts URL.
translations Localized metadata (translated title/description) per language.

openGraph

Open Graph protocol metadata for rich social-media sharing.

Property Description
type Open Graph object type (e.g. website, article).
title OG title (may differ from the page title).
description OG description.
url Canonical URL for this page.
image Image URL for social sharing (recommended 1200×630px).
imageAlt Alternative text for the OG image.
siteName Name of the overall website.
locale Locale in language_TERRITORY form.
video Video URL when sharing video content.
audio Audio URL when sharing audio content.

twitter

Twitter/X Card metadata.

Property Description
card Card type (summary, summary_large_image, app, player).
title Twitter Card title.
description Twitter Card description.
image Image URL (min 144×144 for summary, 300×157 for large).
imageAlt Alternative text for the image.
site Twitter @username of the website.
creator Twitter @username of the content creator.
player HTTPS URL to a video player plus width/height (player cards).
app App name, store IDs, and deep-link URLs for app cards.

structuredData

Schema.org JSON-LD structured data emitted as a <script type="application/ld+json"> block. Supported helpers include Article, Organization, and PostalAddress.

Property Description
@context Schema.org context (https://schema.org).
@type Schema.org type (e.g. Article, Organization, Product).
... Type-specific fields — e.g. for Article: headline, author ({ name, url }), publisher ({ name, logo }), image, dates.
meta:
  structuredData:
    '@context': https://schema.org
    '@type': Article
    headline: '$record.title'
    author: { name: '$record.author', url: '$record.author_url' }
    image: '$record.cover'

favicons

Favicon configuration for browsers and devices.

Property Description
default Default icon path (SVG or ICO).
apple iOS home-screen icon.
sizes Size-specific favicons ({ src, sizes, type }, e.g. 32×32, 16×16).
maskIcon Safari pinned-tab mask icon path and color.

Performance Hints

Resource hints injected into the head to speed up loading.

Property Description
preload Critical resources to preload — each { href, as, type?, media?, crossorigin? }.
dnsPrefetch Domains to DNS-prefetch (array of domains).
customHead Additional custom <head> elements ({ tag, attributes, content }).
meta:
  preload:
    - { href: /fonts/inter.woff2, as: font, type: font/woff2, crossorigin: anonymous }
  dnsPrefetch: ['https://cdn.example.com']
  favicons:
    default: /favicon.svg
    apple: /apple-touch-icon.png