Frontmatter Reference
Цей контент ще не доступний вашою мовою.
You can customize individual Markdown and MDX pages in Starlight by setting values in their frontmatter. For example, a regular page might set title
and description
fields:
Frontmatter fields
title
(required)
type: string
You must provide a title for every page. This will be displayed at the top of the page, in browser tabs, and in page metadata.
description
type: string
The page description is used for page metadata and will be picked up by search engines and in social media previews.
slug
type: string
Override the slug of the page. See “Defining custom IDs” in the Astro docs for more details.
editUrl
type: string | boolean
Overrides the global editLink
config. Set to false
to disable the “Edit page” link for a specific page or provide an alternative URL where the content of this page is editable.
head
type: HeadConfig[]
You can add additional tags to your page’s <head>
using the head
frontmatter field. This means you can add custom styles, metadata or other tags to a single page. Similar to the global head
option.
tableOfContents
type: false | { minHeadingLevel?: number; maxHeadingLevel?: number; }
Overrides the global tableOfContents
config.
Customize the heading levels to be included or set to false
to hide the table of contents on this page.
template
type: 'doc' | 'splash'
default: 'doc'
Set the layout template for this page.
Pages use the 'doc'
layout by default.
Set to 'splash'
to use a wider layout without any sidebars designed for landing pages.
hero
type: HeroConfig
Add a hero component to the top of this page. Works well with template: splash
.
For example, this config shows some common options, including loading an image from your repository.
You can display different versions of the hero image in light and dark modes.
HeroConfig
banner
type: { content: string }
Displays an announcement banner at the top of this page.
The content
value can include HTML for links or other content.
For example, this page displays a banner including a link to example.com
.
lastUpdated
type: Date | boolean
Overrides the global lastUpdated
option. If a date is specified, it must be a valid YAML timestamp and will override the date stored in Git history for this page.
prev
type: boolean | string | { link?: string; label?: string }
Overrides the global pagination
option. If a string is specified, the generated link text will be replaced and if an object is specified, both the link and the text will be overridden.
next
type: boolean | string | { link?: string; label?: string }
Same as prev
but for the next page link.
pagefind
type: boolean
default: true
Set whether this page should be included in the Pagefind search index. Set to false
to exclude a page from search results:
draft
type: boolean
default: false
Set whether this page should be considered a draft and not be included in production builds and autogenerated link groups. Set to true
to mark a page as a draft and make it only visible during development.
sidebar
type: SidebarConfig
Control how this page is displayed in the sidebar, when using an autogenerated link group.
SidebarConfig
label
type: string
default: the page title
Set the label for this page in the sidebar when displayed in an autogenerated group of links.
order
type: number
Control the order of this page when sorting an autogenerated group of links. Lower numbers are displayed higher up in the link group.
hidden
type: boolean
default: false
Prevents this page from being included in an autogenerated sidebar group.
badge
type: string | BadgeConfig
Add a badge to the page in the sidebar when displayed in an autogenerated group of links.
When using a string, the badge will be displayed with a default accent color.
Optionally, pass a BadgeConfig
object with text
, variant
, and class
fields to customize the badge.
attrs
type: Record<string, string | number | boolean | undefined>
HTML attributes to add to the page link in the sidebar when displayed in an autogenerated group of links.
Customize frontmatter schema
The frontmatter schema for Starlight’s docs
content collection is configured in src/content.config.ts
using the docsSchema()
helper:
Learn more about content collection schemas in “Defining a collection schema” in the Astro docs.
docsSchema()
takes the following options:
extend
type: Zod schema or function that returns a Zod schema
default: z.object({})
Extend Starlight’s schema with additional fields by setting extend
in the docsSchema()
options.
The value should be a Zod schema.
In the following example, we provide a stricter type for description
to make it required and add a new optional category
field:
To take advantage of the Astro image()
helper, use a function that returns your schema extension: