Конфигурация Frontmatter

Frontmatter позволяет настраивать страницы индивидуально. В каждом файле markdown вы можете использовать конфигурацию frontmatter для переопределения конфигурации на уровне сайта или темы. Также существуют опции конфигурации, которые вы можете определить только в frontmatter.

Пример использования:

---
title: Документация с VitePress
editLink: true
---

Вы можете получить доступ к данным frontmatter через глобальную переменную $frontmatter в выражениях Vue:

Конфигурация Frontmatter

title

• Тип: string

Заголовок страницы. То же самое, что и config.title, и он переопределяет конфигурацию на уровне сайта.

---
title: VitePress
---

titleTemplate

• Тип: string | boolean

Суффикс для заголовка. То же самое, что и config.titleTemplate, и он переопределяет конфигурацию на уровне сайта.

---
title: VitePress
titleTemplate: Статический генератор сайтов на Vite & Vue
---

description

• Тип: string

Описание страницы. То же самое, что и config.description, и он переопределяет конфигурацию на уровне сайта.

---
description: VitePress
---

head

• Тип: HeadConfig[]

Укажите дополнительные теги head, которые будут внедрены для текущей страницы. Будут добавлены после тегов head, внедренных конфигурацией на уровне сайта.

---
head:
  - - meta
    - name: description
      content: hello
  - - meta
    - name: keywords
      content: super duper SEO
---

type HeadConfig =
  | [string, Record<string, string>]
  | [string, Record<string, string>, string]

Только для стандартной темы

Следующие опции frontmatter применимы только при использовании стандартной темы.

layout

• Тип: doc | home | page
• По умолчанию: doc

Определяет макет страницы.

• doc - Применяет стандартные стили документации к содержимому markdown.
• home - Специальный макет для "Главной страницы". Вы можете добавить дополнительные опции, такие как hero и features, для быстрого создания красивой целевой страницы.
• page - Поведение аналогично doc, но не применяет стили к содержимому. Полезно, когда вы хотите создать полностью настраиваемую страницу.

---
layout: doc
---

hero только для главной страницы

Определяет содержимое секции героя на главной странице, когда layout установлен в home. Подробнее в Стандартная тема: Главная страница.

features только для главной страницы

Определяет элементы для отображения в секции функций, когда layout установлен в home. Подробнее в Стандартная тема: Главная страница.

navbar

• Тип: boolean
• По умолчанию: true

Отображать ли навигационную панель.

---
navbar: false
---

sidebar

• Тип: boolean
• По умолчанию: true

Отображать ли боковую панель.

---
sidebar: false
---

aside

• Тип: boolean | 'left'
• По умолчанию: true

Определяет расположение компонента aside в макете doc.

Установка этого значения в false предотвращает отображение контейнера aside.
Установка этого значения в true отображает aside справа.
Установка этого значения в 'left' отображает aside слева.

---
aside: false
---

outline

• Тип: number | [number, number] | 'deep' | false
• По умолчанию: 2

Уровни заголовков в оглавлении для отображения на странице. То же самое, что и config.themeConfig.outline.level, и он переопределяет значение, установленное в конфигурации на уровне сайта.

lastUpdated

• Тип: boolean | Date
• По умолчанию: true

Отображать ли текст последнего обновления в нижнем колонтитуле текущей страницы. Если указана дата и время, они будут отображаться вместо последней временной метки изменения в Git.

---
lastUpdated: false
---

editLink

• Тип: boolean
• По умолчанию: true

Отображать ли ссылку для редактирования в нижнем колонтитуле текущей страницы.

---
editLink: false
---

footer

• Тип: boolean
• По умолчанию: true

Отображать ли нижний колонтитул.

---
footer: false
---

pageClass

• Тип: string

Добавить дополнительное имя класса к конкретной странице.

---
pageClass: custom-page-class
---

Затем вы можете настроить стили этой конкретной страницы в файле .vitepress/theme/custom.css:

.custom-page-class {
  /* стили специфичные для страницы */
}