title: "用户界面" post_status: publish comment_status: open taxonomy: category: - gutenberg-docs post_tag: - User Interface - Explanations - Repos

用户界面

区块编辑器

区块编辑器的整体布局采用顶部工具栏、下方内容区的设计。

工具栏包含文档级操作：编辑/选择模式、保存状态、全局操作（撤销/重做/插入）、设置切换和发布选项。

内容区域包含文档主体。

设置侧边栏包含文档的附加设置（标签、分类、发布时间等）以及“区块”标签页中的区块设置。工具栏中的齿轮按钮可隐藏设置侧边栏，让用户享受更沉浸的写作体验。在小屏幕上，侧边栏默认处于隐藏状态。

区块

区块本身是编辑器最基本的单元。一般来说，所有内容都是区块。用户使用区块构建文章和页面，模拟底层 HTML 标记的垂直流。

通过将文档的每个部分呈现为可操作的区块，我们在上下文中呈现特定于区块的功能。这受到桌面应用程序惯例的启发，允许实现广泛的高级功能，而不会使界面变得臃肿。

选中的区块会显示一系列上下文操作：

区块界面具有基本操作。区块编辑器旨在提供良好、通用的默认设置，因此用户应该能够创建完整的文档，而无需实际使用设置侧边栏中的高级操作。

区块工具栏突出显示常用操作。区块图标位于区块工具栏中，包含针对所选区块的高级控件。它主要允许用户将区块转换为另一种兼容的区块类型。某些区块还使用区块图标让用户从一组替代区块样式中进行选择。

区块格式化选项允许用户调整区块级别的设置，而内联格式化选项允许调整区块内部的元素。当区块较长时，区块工具栏会在用户向下滚动页面时固定在屏幕顶部。

可以通过区块移动器图标上下移动区块。通过省略号菜单可访问其他区块操作：删除和复制区块，以及“编辑为 HTML”和“转换为可重用区块”等高级操作。

未选中的区块不会显示区块工具栏或任何其他上下文控件。实际上，未选中的区块是内容本身的预览：

请注意，选择和焦点可能不同。图像区块可以被选中，而焦点位于标题字段上。

设置侧边栏

侧边栏包含两个标签页：文档和区块：

• 文档标签页 显示正在编辑的文章或页面的元数据和设置。
• 区块标签页 显示当前所选区块的元数据和设置。

每个标签页都包含多组可编辑字段（侧边栏部分），用户可以展开或收起。

如果某个区块需要高级配置，这些设置应位于设置侧边栏中。请不要将区块基本操作所必需的任何内容放在侧边栏的区块标签页中；用户可能会关闭侧边栏以获得沉浸式的写作体验。请选择良好的默认值，并将重要操作放在区块工具栏中。

可以放在侧边栏区块标签页中的操作可能包括：

• 文本的首字下沉
• 图库的列数
• “最新文章”区块中的文章数量或分类
• 任何在执行基本任务时不需要访问的配置

区块库

当用户通过工具栏或在内容区域内插入区块时，区块库 便会显示。库内区块按可展开的类别进行组织。区块库的搜索栏会根据用户输入的内容自动筛选区块列表。用户可以通过选择 区块按钮 或 区块名称 来选用区块。