Frontmatter 設定
Frontmatter 能夠啟用基於頁面的設定。在每個 markdown 檔案中，你可以使用 Frontmatter 設定來覆寫網站層級或佈景主題層級的設定選項。此外，有些設定選項只能在 Frontmatter 中定義。
範例用法
---
title: Docs with VitePress
editLink: true
---你可以透過 Vue 表達式中的全域變數 $frontmatter 來存取 Frontmatter 資料
{{ $frontmatter.title }}標題
- 類型：
字串
頁面的標題。它與 config.title 相同，且會覆寫網站層級的設定。
---
title: VitePress
---titleTemplate
- 類型：
字串 | 布林值
標題的後綴。它與 config.titleTemplate 相同，且會覆寫網站層級的設定。
---
title: VitePress
titleTemplate: Vite & Vue powered static site generator
---說明
- 類型：
字串
頁面的說明。它與 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 選項僅適用於使用預設佈景主題時。
版面
- 類型：
文件 | 首頁 | 頁面 - 預設值：
文件
決定頁面的版面。
文件- 將預設的文件樣式套用至 markdown 內容。首頁- 「首頁」的特殊版面。你可以新增額外的選項，例如英雄和功能，以快速建立美觀的登陸頁面。頁面- 行為類似於文件，但不會將任何樣式套用至內容。當你想要建立一個完全自訂的頁面時，這會很有用。
---
layout: doc
---英雄 僅限首頁
當 版面 設為 首頁 時，定義首頁英雄區段的內容。更多詳細資訊請參閱 預設佈景主題：首頁。
功能 僅限首頁
定義當 layout 設為 home 時，在功能區段中顯示的項目。更多詳細資訊請參閱 預設佈景主題：首頁。
navbar
- 類型：
boolean - 預設值：
true
是否顯示 navbar。
---
navbar: false
---sidebar
- 類型：
boolean - 預設值：
true
是否顯示 sidebar。
---
sidebar: false
---aside
- 類型：
boolean | 'left' - 預設值：
true
定義 doc 版面中 aside 元件的位置。
將此值設為 false 可避免 aside 容器的呈現。
將此值設為 true 可將 aside 呈現於右側。
將此值設為 'left' 可將 aside 呈現於左側。
---
aside: false
---outline
- 類型：
number | [number, number] | 'deep' | false - 預設值：
2
頁面中要顯示的 outline 標頭層級。它與 config.themeConfig.outline.level 相同，且會覆寫網站層級設定中的值。
lastUpdated
- 類型：
boolean | Date - 預設值：
true
是否在當前頁面的頁尾顯示 上次更新 文字。如果指定日期時間，它將會顯示在最後一次 git 修改時間戳記中。
---
lastUpdated: false
---editLink
- 類型：
boolean - 預設值：
true
是否在當前頁面的頁尾顯示 編輯連結。
---
editLink: false
---footer
- 類型：
boolean - 預設值：
true
是否顯示 footer。
---
footer: false
---pageClass
- 類型：
字串
將額外的類別名稱加入特定頁面。
---
pageClass: custom-page-class
---然後你可以自訂此特定頁面的樣式，在 .vitepress/theme/custom.css 檔案中
.custom-page-class {
/* page-specific styles */
}