# 创建和编辑页面 (/zh/editor/pages)

<!-- agent-signals: reading_time_min: 5 · est_tokens: 3035 · updated: 2026-09-23 -->
Related: [如何使用编辑器](/zh/editor/tutorial.md), [发布更改](/zh/editor/publish.md), [审阅更改](/zh/editor/review.md), [在编辑器中协作](/zh/editor/collaborate.md), [询问智能体](/zh/editor/agent.md), [编辑器的 AI 与发布设置](/zh/editor/settings.md)

<div id="workspace-and-site">
  ## Workspace 与 Site [#workspace-与-site]
</div>

编辑器侧边栏有两个标签页：**Workspace** 和 **Site**。

**Workspace** 包含不属于 Git 仓库或已发布站点的页面。Workspace 页面会自动保存，没有发布步骤。

* **Recents**：你最近打开的 workspace 页面。
* **Starred**：你已加星标的 workspace 页面。若要给页面加星标，请打开其选项菜单并选择 **Star**。星标仅对你可见。
* **Personal**：你的[私有页面](#private-pages)。
* **Teamspace**：与组织中所有人共享的页面。请参阅 [Teamspace](#teamspace)。
* **Shared with me**：同事直接[与你共享](#share-a-private-page)的页面。

**Site** 包含你的仓库以及访问者在已发布站点上看到的页面。

* **Navigation**：站点导航中的页面和分组，在 `docs.json` 中定义。
* **Files**：仓库中所有不在导航里的文件，包括图片、视频、OpenAPI 规范和 `docs.json`。

Recents、starred 和 shared with me 只在其中有内容时才会显示。

拖动分区标题可重新排序标签页中的分区。点击分区标题可折叠或展开它。编辑器会将你的分区顺序和折叠状态保存到你的账户中。

切换标签页会重新打开你在该标签页上查看的最后一个页面。顶部栏会随标签页而变化。**Share** 只在 **Workspace** 上显示。分支选择器、**Preview** 和 **Publish** 只在 **Site** 上显示。

<div id="create-a-page">
  ## 创建页面 [#创建页面]
</div>

若要创建页面，请在你想放置该页面的位置点击 <Icon icon="<svg xmlns=&#x22;http://www.w3.org/2000/svg&#x22; viewBox=&#x22;0 0 24 24&#x22; fill=&#x22;none&#x22;><path d=&#x22;M12.001 5.00003V19.002&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/><path d=&#x22;M19.002 12.002L4.99998 12.002&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/></svg>" /> 加号按钮，然后选择 **New page**。

* **Navigation** 分区标题：在导航末尾添加一个新页面。
* 分组或其他导航元素：在该元素内添加一个新页面。
* **Files** 分区标题或 **Files** 中的文件夹：创建一个不在导航中的文件。

**Site** 标签页底部的 **New page** 按钮同样会在导航末尾添加一个页面。

<Tip>
  若要把仓库中已有的页面添加到导航中，请点击 <Icon icon="<svg xmlns=&#x22;http://www.w3.org/2000/svg&#x22; viewBox=&#x22;0 0 24 24&#x22; fill=&#x22;none&#x22;><path d=&#x22;M12.001 5.00003V19.002&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/><path d=&#x22;M19.002 12.002L4.99998 12.002&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/></svg>" /> 加号按钮并选择 **Add existing page**。
</Tip>

相同的菜单还可以创建 group、tab、anchor、dropdown、version、language 和 product 等导航元素。有关每种元素的更多信息，请参阅[导航](/zh/organize/navigation)。

<div id="edit-page-settings">
  ## 编辑页面设置 [#编辑页面设置]
</div>

直接在页面顶部设置页面的标题、描述和图标。将鼠标悬停在标题上方并点击 **Add icon** 即可选择图标或表情符号。当已设置图标的页面处于打开状态时，浏览器标签页会显示该图标。

若要设置其他项，请从侧边栏中打开页面的选项菜单，或点击页面右上角的 <Icon icon="<svg xmlns=&#x22;http://www.w3.org/2000/svg&#x22; viewBox=&#x22;0 0 24 24&#x22; fill=&#x22;none&#x22;><path d=&#x22;M12 12.002H12.5M19 12.002H19.5M5 12.002H5.5M12 13.002C12.5523 13.002 13 12.5542 13 12.002C13 11.4497 12.5523 11.002 12 11.002C11.4477 11.002 11 11.4497 11 12.002C11 12.5542 11.4477 13.002 12 13.002ZM19 13.002C19.5523 13.002 20 12.5542 20 12.002C20 11.4497 19.5523 11.002 19 11.002C18.4477 11.002 18 11.4497 18 12.002C18 12.5542 18.4477 13.002 19 13.002ZM5 13.002C5.55228 13.002 6 12.5542 6 12.002C6 11.4497 5.55228 11.002 5 11.002C4.44772 11.002 4 11.4497 4 12.002C4 12.5542 4.44772 13.002 5 13.002Z&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/></svg>" /> **More options**，然后选择 **Page settings**。**Page settings** 面板将设置分为以下几组：

* **URL**：页面的路径和重定向 URL。更改路径会移动该文件。
* **Navigation**：侧边栏标题、tag、mode 以及页面是否隐藏。
* **SEO & sharing**：Open Graph 图片和关键词。

Groups、tabs 和其他导航元素有各自的设置面板，例如 **Group settings** 和 **Tab settings**。可以从元素的选项菜单打开这些面板。有关具体设置的更多信息，请参阅[页面](/zh/organize/pages)。

<div id="add-media">
  ## 添加媒体 [#添加媒体]
</div>

输入 <kbd>/image</kbd> 或 <kbd>/video</kbd> 上传文件，或选择仓库中已有的文件。你也可以把文件从电脑拖放到页面上，或从 **Files** 分区把图片或视频拖到页面上。

* 上传的文件会保存到你的 `images/`、`videos/` 和 `files/` 文件夹中，并随下次发布一起提交。在插入上传之前，你可以编辑其文件路径。
* 你可以上传 PNG、JPG、GIF、WebP、AVIF、ICO 和 BMP 图片，MP4、WebM 和 MOV 视频，以及 PDF 文件。SVG 文件无法在编辑器中上传。
* 每次上传的文件大小最多为 20 MB。
* 若要在深色模式下提供另一张图片，请选中图片，点击 **Edit Image**，然后设置 **Dark mode image**。
* 输入 <kbd>/embed</kbd> 添加嵌入内容。在 **Video link** 标签页中粘贴 YouTube、Loom 或 Vimeo 的 URL，或指向视频文件的直链。在 **Embed code** 标签页中粘贴 iframe 或其他嵌入代码片段。

有关图片格式和 Frame 组件的用法，请参阅[图片和嵌入内容](/zh/create/image-embeds)。

<div id="organize-navigation">
  ## 组织导航 [#组织导航]
</div>

在 **Navigation** 中拖动元素即可重新排序或嵌套它们。发布时，编辑器会把你的更改写入 `docs.json`。

<Note>
  有些元素无法嵌套在其他元素中。例如，tabs 不能嵌套在 groups 中。编辑器会阻止无效的组合。
</Note>

若要选择多个项目，请按住 <kbd>Shift</kbd> 键点击以选中一段范围。拖动所选项或右键点击即可一次性移动、复制或删除所有选中的项。按 <kbd>Esc</kbd> 可清除选择。

若要将分组或其他元素转换为其他类型，请打开其选项菜单并选择 **Convert to**。

跨站点各分区显示的全局导航元素（例如 anchors 和 tabs）不在侧边栏树中。若要管理它们，请点击 **Site** 标签页底部的 **Site settings**，然后进入 **Navigation**。

<div id="add-and-remove-pages-from-your-navigation">
  ### 从导航中添加和移除页面 [#从导航中添加和移除页面]
</div>

把 **Files** 中的页面拖到 **Navigation** 中，即可在该位置添加它。将文件夹拖入则会把它作为分组添加。你也可以从文件的选项菜单中选择 **Move to navigation**。

若要在不删除文件的情况下把页面或分组从导航中移除，请把它从 **Navigation** 拖到 **Files** 中，或从其选项菜单中选择 **Move to files**。移动后会出现一个撤销提示。

<div id="files">
  ## 文件 [#文件]
</div>

点击 **Files** 中的文件即可打开它。

* 图片会在预览中打开。点击图片可放大。
* 视频会在编辑器中播放。
* `docs.json` 会以 source 模式打开。
* 文本和代码文件（例如 YAML、JSON 和 CSS）会在 source 编辑器中打开。
* 其他文件（例如字体和压缩包）无法在编辑器中预览。

若要上传文件，请把它们从电脑拖到 **Files** 分区。

<div id="move-a-page">
  ## 移动页面 [#移动页面]
</div>

若要把页面移动到其他文件夹，请打开其选项菜单并选择 **Move to**，或在页面打开时按 <kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>P</kbd>（macOS）或 <kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>P</kbd>（Windows）。

你可以通过以下方式打开页面的选项菜单：

* 打开的页面右上角的 <Icon icon="<svg xmlns=&#x22;http://www.w3.org/2000/svg&#x22; viewBox=&#x22;0 0 24 24&#x22; fill=&#x22;none&#x22;><path d=&#x22;M12 12.002H12.5M19 12.002H19.5M5 12.002H5.5M12 13.002C12.5523 13.002 13 12.5542 13 12.002C13 11.4497 12.5523 11.002 12 11.002C11.4477 11.002 11 11.4497 11 12.002C11 12.5542 11.4477 13.002 12 13.002ZM19 13.002C19.5523 13.002 20 12.5542 20 12.002C20 11.4497 19.5523 11.002 19 11.002C18.4477 11.002 18 11.4497 18 12.002C18 12.5542 18.4477 13.002 19 13.002ZM5 13.002C5.55228 13.002 6 12.5542 6 12.002C6 11.4497 5.55228 11.002 5 11.002C4.44772 11.002 4 11.4497 4 12.002C4 12.5542 4.44772 13.002 5 13.002Z&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/></svg>" /> **More options**。
* 侧边栏中页面旁边的 <Icon icon="<svg xmlns=&#x22;http://www.w3.org/2000/svg&#x22; viewBox=&#x22;0 0 24 24&#x22; fill=&#x22;none&#x22;><path d=&#x22;M12 12.002H12.5M19 12.002H19.5M5 12.002H5.5M12 13.002C12.5523 13.002 13 12.5542 13 12.002C13 11.4497 12.5523 11.002 12 11.002C11.4477 11.002 11 11.4497 11 12.002C11 12.5542 11.4477 13.002 12 13.002ZM19 13.002C19.5523 13.002 20 12.5542 20 12.002C20 11.4497 19.5523 11.002 19 11.002C18.4477 11.002 18 11.4497 18 12.002C18 12.5542 18.4477 13.002 19 13.002ZM5 13.002C5.55228 13.002 6 12.5542 6 12.002C6 11.4497 5.55228 11.002 5 11.002C4.44772 11.002 4 11.4497 4 12.002C4 12.5542 4.44772 13.002 5 13.002Z&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/></svg>" /> 菜单。
* 在侧边栏中右键点击页面。

在选择器中，搜索可以过滤文件夹，展开文件夹可以查看嵌套的目标位置，选择一个文件夹即可移动页面。当前所在的文件夹会被标记为 **Current** 且无法选择。移动后会出现带有 **Revert** 的提示。

移动 site 页面会把其文件移到新的文件夹中。Editors 和 admins 可以移动 site 页面。你可以移动自己在 **Personal** 和 **Teamspace** 中管理的 workspace 页面，但无法移动 **Shared with me** 中的页面。

<div id="delete-a-page">
  ## 删除页面 [#删除页面]
</div>

若要删除页面，请点击页面右上角的 <Icon icon="<svg xmlns=&#x22;http://www.w3.org/2000/svg&#x22; viewBox=&#x22;0 0 24 24&#x22; fill=&#x22;none&#x22;><path d=&#x22;M12 12.002H12.5M19 12.002H19.5M5 12.002H5.5M12 13.002C12.5523 13.002 13 12.5542 13 12.002C13 11.4497 12.5523 11.002 12 11.002C11.4477 11.002 11 11.4497 11 12.002C11 12.5542 11.4477 13.002 12 13.002ZM19 13.002C19.5523 13.002 20 12.5542 20 12.002C20 11.4497 19.5523 11.002 19 11.002C18.4477 11.002 18 11.4497 18 12.002C18 12.5542 18.4477 13.002 19 13.002ZM5 13.002C5.55228 13.002 6 12.5542 6 12.002C6 11.4497 5.55228 11.002 5 11.002C4.44772 11.002 4 11.4497 4 12.002C4 12.5542 4.44772 13.002 5 13.002Z&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/></svg>" /> **More options**，然后点击 **Move to trash**。你也可以从侧边栏中页面的选项菜单删除页面。

删除 site 页面会同时移除文件及其导航条目。删除后会出现带有 **Undo** 的提示。若要在不删除文件的情况下把页面从导航中移除，请改选 **Move to files**。

删除 workspace 页面是不可撤销的。对于 workspace 页面，**More options** 菜单会显示 **Delete page**。

Editors 和 admins 可以删除 site 页面。

<div id="version-history">
  ## 版本历史 [#版本历史]
</div>

版本历史让你可以将页面与此前保存的版本进行对比并恢复其中一个版本。`docs.json` 不支持版本历史。

只要内容与最近一次记录的版本不同，编辑器就会记录一条新条目。版本历史按分支划分，只能查看当前分支的版本历史。

1. 点击页面右上角的 <Icon icon="<svg xmlns=&#x22;http://www.w3.org/2000/svg&#x22; viewBox=&#x22;0 0 24 24&#x22; fill=&#x22;none&#x22;><path d=&#x22;M12 12.002H12.5M19 12.002H19.5M5 12.002H5.5M12 13.002C12.5523 13.002 13 12.5542 13 12.002C13 11.4497 12.5523 11.002 12 11.002C11.4477 11.002 11 11.4497 11 12.002C11 12.5542 11.4477 13.002 12 13.002ZM19 13.002C19.5523 13.002 20 12.5542 20 12.002C20 11.4497 19.5523 11.002 19 11.002C18.4477 11.002 18 11.4497 18 12.002C18 12.5542 18.4477 13.002 19 13.002ZM5 13.002C5.55228 13.002 6 12.5542 6 12.002C6 11.4497 5.55228 11.002 5 11.002C4.44772 11.002 4 11.4497 4 12.002C4 12.5542 4.44772 13.002 5 13.002Z&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/></svg>" /> **More options**，然后点击 **Version history**。
2. 选择一个版本。编辑器会显示当前页面与该版本的差异。
3. 若要恢复它，请点击 **Restore this version**，然后确认。

若要退出对比，请点击 **Exit comparison**，或按 <kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>D</kbd>（macOS）或 <kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>D</kbd>（Windows）。

任何人都可以对比版本。Editors 和 admins 可以恢复 site 页面的版本。对于 workspace 页面，你需要拥有该页面上的 **Editor** 或 **Publisher** 角色才能恢复某个版本。

恢复某个版本会替换页面当前的内容。恢复 site 页面时，只会在当前分支上恢复。恢复 workspace 页面时，会在所有分支上恢复。

<div id="private-pages">
  ## 私有页面 [#私有页面]
</div>

私有页面是位于 **Workspace** 标签页 **Personal** 分区中的草稿。它们仅你自己可见，不会提交到你的仓库，除非你把它们移到 site 上，否则永远不会出现在已发布的站点上。

若要创建私有页面或文件夹，请点击 **Personal** 分区标题上的 <Icon icon="<svg xmlns=&#x22;http://www.w3.org/2000/svg&#x22; viewBox=&#x22;0 0 24 24&#x22; fill=&#x22;none&#x22;><path d=&#x22;M12.001 5.00003V19.002&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/><path d=&#x22;M19.002 12.002L4.99998 12.002&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/></svg>" /> 加号按钮，然后选择 **New page** 或 **New folder**。**Workspace** 标签页底部的 **New page** 按钮同样会创建私有页面。

若要为 workspace 文件夹设置图标或表情符号，请打开其选项菜单并选择 **Change icon**。从 **Icons** 标签页中选择图标，或从 **Emojis** 标签页中选择表情符号，或选择 **Remove** 清除它。

<div id="share-a-private-page">
  ### 共享私有页面 [#共享私有页面]
</div>

若要共享私有页面，请打开它并点击顶部栏中的 **Share**。若要共享文件夹，请在侧边栏中打开其选项菜单并选择 **Share**。搜索同事并为每个人选择角色：

* **Publisher**：编辑、审阅并发布。
* **Editor**：创建和编辑内容。
* **Viewer**：仅查看内容。

在常规访问权限下，选择 **Only people invited** 或组织中的 **Everyone at**。只有 Publishers 才能更改谁具有访问权限。

与你共享的页面会出现在 **Shared with me** 中。若要从侧边栏中移除某个页面，请打开其选项菜单并选择 **Leave**。

<div id="teamspace">
  ## Teamspace [#teamspace]
</div>

Teamspace 页面对组织中所有人可用。与私有页面一样，它们也不会提交到你的仓库。访问权限遵循你的[角色](/zh/dashboard/roles)。Editors 和 admins 可以编辑和管理 teamspace 页面，viewers 可以阅读它们。因为所有人已具有访问权限，所以你无法单独共享 teamspace 页面。

若要创建 teamspace 页面或文件夹，请点击 **Teamspace** 分区标题上的 <Icon icon="<svg xmlns=&#x22;http://www.w3.org/2000/svg&#x22; viewBox=&#x22;0 0 24 24&#x22; fill=&#x22;none&#x22;><path d=&#x22;M12.001 5.00003V19.002&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/><path d=&#x22;M19.002 12.002L4.99998 12.002&#x22; stroke=&#x22;currentColor&#x22; stroke-linecap=&#x22;round&#x22; stroke-linejoin=&#x22;round&#x22; stroke-width=&#x22;1.5&#x22;/></svg>" /> 加号按钮，然后选择 **New page** 或 **New folder**。

若要把私有页面移到 teamspace，请把它从 **Personal** 拖到 **Teamspace**，或打开其选项菜单，选择 **Move to**，然后选择 **Teamspace**。你可以移动页面，但无法移动文件夹。

<div id="move-a-page-to-your-site">
  ## 把页面移到 site 上 [#把页面移到-site-上]
</div>

若要发布个人或 teamspace 页面，请在侧边栏中打开其选项菜单并选择 **Move to site**。该页面会移入你的导航中，侧边栏会切换到 **Site** 并高亮显示它。移动文件夹会把它作为分组添加到导航中，并保留其所有页面和图标。

<Warning>
  在分区之间移动页面是单向的。你无法把页面从 **Teamspace** 移回 **Personal**，或从 **Site** 移回 **Workspace**。
</Warning>
