每个页面都是一个 MDX 文件,它将 Markdown 内容与 React 组件相结合,帮助你创建丰富、交互的文档。
每个页面都以 frontmatter 开始,它是位于文件开头、由 ---
包裹的 YAML metadata。该 metadata 决定页面的显示与行为。
使用 metadata 可以控制:
对本页内容的简要说明。显示在标题下方,并提升 SEO(搜索引擎优化)。
Font Awesome 的 icon 样式。仅在使用 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: "frame"
---
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: ['配置', '设置', '入门指南']
---