最新WordPress古腾堡编辑器深度解析与实用技巧

当WordPress区块编辑器（古腾堡）于2018年12月推出时，我们并未预料到它会带来怎样的变革。尽管我们有充足的时间在测试版中探索，但无法预知正式发布后的用户接受度或开发者的热情。经过三年的发展，古腾堡编辑器在两年多的时间里经历了显著的进化，从最初的最小可行产品（MVP）成长为更成熟的项目，逐步接近为WordPress打造统一的全站编辑体验的目标。鉴于这些变化，我们重新审视古腾堡编辑器，带您了解其最新面貌，并展望未来的发展方向。

### 什么是古腾堡区块编辑器？

古腾堡，也被称为“WordPress区块编辑器”或“WordPress编辑器”，是2018年12月6日随WordPress 5.0一同推出的内容编辑器。它是所有WordPress网站默认的编辑器（除非用户主动禁用），其界面直观易用。与旧版编辑器（现称为“经典编辑器”或“TinyMCE编辑器”）最大的区别在于其基于区块的内容创建方式。在古腾堡中，内容中的每个元素都是一个独立的区块，可轻松编辑和操作。无论是段落、图像、按钮还是其他元素，都将以区块的形式呈现。第三方开发者还可以创建自定义区块，彻底改变WordPress与短代码的关系。例如，嵌入联系表单时，无需再使用短代码（如`[your-form-shortcode]`），只需插入表单插件区块即可。此外，区块编辑器还支持创建复杂的布局，如多列设计或区块分组，以实现更具凝聚力的页面结构。

### 古腾堡与流行替代品的优缺点

在WordPress生态中，用户通常在古腾堡、经典编辑器和页面构建器插件之间进行选择。经典编辑器提供类似字处理器的精简体验，而页面构建器则提供灵活的视觉拖放设计。从设计灵活性来看，经典编辑器（最不灵活）< 古腾堡 < 页面构建器（最灵活）。

**古腾堡与经典编辑器的优缺点：**

**优点：**
– 更直观的视觉设计背景
– 无需短代码，统一区块系统

**缺点：**
– 部分用户觉得写作体验笨拙，每个段落都是独立区块
– 长文章中操作文本可能不便
– 性能优化仍需加强，大量文章时可能滞后

**古腾堡与页面构建器的优缺点：**

**优点：**
– 核心功能，兼容性问题少
– 输出更干净、轻量级的代码，加载速度更快

**缺点：**
– 视觉编辑不如页面构建器灵活
– 设计和布局选项有限

### 如何使用WordPress古腾堡区块编辑器

古腾堡编辑器界面分为三个主要部分：内容区、顶部工具栏和侧边栏。内容区占据大部分屏幕，提供前端视觉预览；顶部工具栏用于插入新区块、撤销/重做等操作；侧边栏包含“文章”和“区块”选项卡，分别用于配置文章设置和区块设置。

**添加区块：**
– 单击“加号”图标即可插入各类区块，如图像、按钮、视频等。
– 将鼠标光标放在目标位置，点击“加号”图标，从分类列表中选择所需区块。
– 插入图像时，可直接上传或从媒体库选择。

**基本格式选项：**
– 单击区块后，浮动工具栏出现，提供粗体、斜体、链接等格式化选项。
– 插入链接时，选中文本，点击工具栏上的链接图标，输入URL即可。

**配置高级区块设置：**
– 单击区块，在侧边栏的“区块”选项卡中查看和调整设置。
– 不同区块提供不同设置，如按钮区块可调整颜色、宽度等。

**重新排列区块：**
– 使用浮动工具栏上的上下箭头移动区块。
– 拖放功能适用于更广泛的移动操作。

**嵌入内容：**
– 古腾堡提供专用区块嵌入YouTube、Vimeo等内容。
– 添加相应区块，粘贴URL即可预览嵌入效果。

**创建多列或分组布局：**
– 使用“栏目”区块创建多列布局，选择列数和比例。
– 使用“组”区块将多个区块分组，如设置背景颜色等。

### 10个提高工作效率的古腾堡技巧

1. **使用/（正斜杠）快速插入区块：**
– 键入“/”后输入区块名称，快速插入常用区块。
– 例如，输入“/image”插入图像区块。

2. **从桌面拖动图像：**
– 直接将图像文件从桌面拖到文章中，自动上传并插入图像区块。

3. **使用部分Markdown格式：**
– 键入“###”创建H3标题区块。
– 安装插件如EditorsKit扩展Markdown支持。

4. **固定格式工具栏：**
– 将浮动工具栏固定在顶部，方便操作。

5. **复制区块及其设置：**
– 选择区块，点击工具栏上的三点图标，选择“复制”。
– 粘贴后保留所有设置。

6. **使用区块列表视图：**
– 打开列表视图，快速选择嵌套区块。
– 编辑器会高亮显示所选区块。

7. **打开代码编辑器：**
– 单击区块工具栏上的“Edit as HTML”编辑单个区块代码。
– 使用HTML自定义区块嵌入完整HTML片段。
– 通过下拉菜单或快捷键Ctrl+Shift+Alt+M打开完整文档代码编辑器。

8. **学习键盘快捷键：**
– 常用快捷键如Shift+Alt+O打开区块列表视图，Ctrl+S保存更改等。

9. **通过区块管理整理界面：**
– 禁用不常用的区块，简化编辑器界面。

10. **为跳转链接添加锚点：**
– 在区块设置的高级区域输入HTML锚点文本，创建跳转链接。

### 深入研究更高级的区块编辑器概念

**区块模式：**
– 区块模式是可重复使用的区块模板，可以是按钮排列、部分甚至整个页面。
– 核心编辑器不支持创建区块模式，但可通过插件如Block Pattern Builder实现。
– 可在WordPress.org上使用官方区块模式库。

**可重复使用的区块：**
– 可重用区块是一组区块的集合，在所有实例中保持一致。
– 选择一个或多个区块，点击“添加到可重用区块”，命名并插入。
– 更新可重用区块时，所有实例自动同步。

### 使用插件扩展区块编辑器

插件可扩展古腾堡的功能，包括添加新内容区块、模板、界面修改等。例如，Ultimate Addons for Gutenberg、Kadence Blocks等插件提供丰富的区块和功能。许多插件与古腾堡兼容，如联系表单插件提供专用区块嵌入表单。

### WordPress古腾堡编辑器和完整站点编辑

古腾堡的长期目标是实现全站编辑（Full Site Editing），使用区块编辑器设计网站所有部分，包括页眉、页脚、侧边栏等。从WordPress 5.8开始，全站编辑逐步实现：

– **使用区块管理小工具：**
– 通过区块编辑器管理侧边栏和页脚，替代传统小工具。
– 可在不同小工具区域之间移动区块。

– **新的主题区块：**
– 添加Query Loop区块动态显示内容，如博客列表。
– 嵌套其他主题区块控制内容模板。

– **模板编辑模式：**
– 支持的主题可使用区块设计文章和页面模板。
– 创建新模板或选择现有模板进行编辑。

**Blockbase完整站点编辑示例：**
– Blockbase是Automattic的实验性主题，提供全站编辑概念。
– 使用区块编辑器设计网站模板，如标题模板。
– 提供新的设计区块，如Query Loop、Post Date等。

### 小结

自2018年以来，古腾堡区块编辑器取得了长足的进步，未来将作为全站编辑的核心。本文涵盖了从基础到高级的编辑技巧，并展望了全站编辑的未来。尽管用户仍可选择经典编辑器，但古腾堡将持续发展，值得持续关注和探索。

文章网址：https://www.wpbull.com/jiqiao/10083.html

最新WordPress古腾堡编辑器深度解析与实用技巧

相关推荐