每个页面都是一个 MDX 文件，它将 Markdown 内容与 React 组件结合，让你创建丰富、交互的文档。

​
页面元数据

每个页面都以 frontmatter 开始，即文件开头由 --- 包裹的 YAML 元数据。该元数据决定页面的呈现和行为。 使用元数据可以控制：
  • 页面标题和描述
  • 侧边栏标题、图标和标签
​
title
string
required
出现在导航和浏览器标签页中的页面标题。
​
description
string
对本页面内容的简要说明。显示在标题下方，有助于提升 SEO。
​
sidebarTitle
string
显示在侧边栏导航中的简短标题。
​
icon
string
要显示的图标。可选值：
  • Font Awesome 图标 的名称
  • Lucide 图标 的名称
  • 用花括号包裹的、与 JSX 兼容的 SVG 代码
  • 指向外部托管图标的 URL
  • 项目中图标文件的路径
自定义 SVG 图标：
  1. 使用 SVGR 转换器将 SVG 转换。
  2. 将 SVG 代码粘贴到 SVG 输入框。
  3. 从 JSX 输出框复制完整的 <svg>...</svg> 元素。
  4. 用花括号包裹 JSX 兼容的 SVG 代码：icon={<svg ...> ... </svg>}。
  5. 按需调整 height 和 width。
​
iconType
string
Font Awesome 图标样式。仅在使用 Font Awesome 图标时使用。可选值：regular、solid、light、thin、sharp-solid、duotone、brands。
​
tag
string
显示在侧边栏页面标题旁的标签。
Example YAML frontmatter
---
title: "About frontmatter"
description: "Frontmatter is the metadata that controls how your page appears and behaves"
sidebarTitle: "Frontmatter"
icon: "book"
tag: "NEW"
---

​
页面模式

通过 mode 设置控制页面的展示方式。

​
默认

如果未指定模式，将采用带侧边栏导航和目录的标准布局。 
---
title: "默认页面标题"
---

​
宽屏

宽屏模式会隐藏目录。它适用于没有任何标题的页面，或当你希望利用更多水平空间时。所有主题均支持宽屏模式。 
---
title: "Wide page title"
mode: "wide"
---

​
自定义

自定义模式提供极简布局，除顶部导航栏外移除所有元素。它是一块空白画布，可用于创建着陆页或任何其他希望尽量减少导航元素的独特布局。自定义模式适用于所有主题。 
---
title: "Custom page title"
mode: "custom"
---

​
Frame

Frame 模式提供与 custom 模式相似的布局，但会保留侧边栏导航。此页面模式在保留默认导航体验的同时，支持使用自定义 HTML 和组件。Frame 模式仅适用于 Aspen 和 Almond 主题。 
---
title: "Frame page title"
mode: "frame"
---

​
居中

居中模式会移除侧边栏和目录，并将内容居中显示。适用于变更日志或其他需要突出内容的页面。Mint 和 Linden 主题均提供居中模式。 
---
title: "Center page title"
mode: "center"
---

​
API 页面

在 frontmatter 中添加 API 规范（api 或 openapi）即可创建交互式 API 试玩台。 
---
openapi: "GET /endpoint"
---
了解更多关于构建API 文档的内容。 在导航中使用 url 元数据直接链接到外部站点。 
---
title: "npm Package"
url: "https://www.npmjs.com/package/mint"
---

​
搜索引擎优化

大多数 SEO 元标签会自动生成。你可以手动设置 SEO 元标签，以提升站点的 SEO、社交分享效果和浏览器兼容性。
含有冒号的元标签必须用引号括起来。
---
"twitter:image": "/images/social-preview.jpg"
---
参见 SEO 以了解完整的 SEO 元数据选项。

​
内部搜索关键词

在元数据中提供 keywords 可提升特定页面在内置搜索中的可发现性。这些关键词不会作为页面内容显示，也不会直接出现在搜索结果列表中，但当用户检索这些关键词时，相关页面将作为搜索结果呈现。 
---
keywords: ['configuration', 'setup', 'getting started']
---