每个页面都是一个 MDX 文件,它将 Markdown 内容与 React 组件相结合,帮助你创建丰富、交互性强的文档。
每个页面都以 frontmatter 开始,它是在文件开头由 ---
包裹的 YAML 元数据。该元数据定义了页面的呈现方式和行为。
使用元数据可控制:
对本页内容的简要说明。显示在标题下方,并提升 SEO(搜索引擎优化)效果。
Font Awesome 图标样式。仅在使用 Font Awesome 图标时生效。选项:regular
、solid
、light
、thin
、sharp-solid
、duotone
、brands
。
---
title: "关于 frontmatter"
description: "Frontmatter 是控制页面显示和行为的 metadata"
sidebarTitle: "Frontmatter"
icon: "book"
tag: "NEW"
---
通过 mode
设置控制页面的显示方式。
如果未指定模式,将采用带有侧边导航和目录的标准布局。
宽屏模式会隐藏目录。这对没有任何标题的页面,或当你想利用更多横向空间时很有用。所有主题均支持宽屏模式。
---
title: "宽页面标题"
mode: "wide"
---
自定义模式提供极简布局,除顶部导航栏外移除所有元素。它是一块空白画布,可用于创建登录页或任何其他独特布局,适合需要尽量精简导航元素的场景。自定义模式适用于所有主题。
---
title: "自定义页面标题"
mode: "custom"
---
Frame 模式提供与自定义模式类似的布局,但保留侧边栏导航。该模式在维持默认导航体验的同时,允许使用自定义 HTML 和组件。Frame 模式仅适用于 Aspen 和 Almond 主题。
---
title: "Frame 页面标题"
mode: "frame"
---
居中模式会移除侧边栏和目录,将内容置于页面中央。它适用于需要突出内容的页面,如更新日志等。居中模式适用于 Mint 和 Linden 主题。
---
title: "居中页面标题"
mode: "center"
---
在 frontmatter 中添加 API 规范(api
或 openapi
)即可创建交互式 API 操作台。
---
openapi: "GET /endpoint"
---
进一步了解如何构建API 文档。
在导航中使用 url
metadata 直接链接到外部站点。
---
title: "npm 包"
url: "https://www.npmjs.com/package/mint"
---
大多数 SEO 元标签会自动生成。你也可以手动设置 SEO 元标签,以提升站点的 SEO(搜索引擎优化)、社交分享效果和浏览器兼容性。
---
"twitter:image": "/images/social-preview.jpg"
---
有关完整的 SEO(搜索引擎优化)metadata 选项,请参阅 SEO。
在 metadata 中提供 keywords
,可提升特定页面在内置搜索中的可发现性。这些关键词不会作为页面内容显示,也不会出现在搜索结果列表中,但当用户搜索这些词时,该页面会相应地显示为搜索结果。
---
keywords: ['配置', '设置', '入门指南']
---