在 WordPress 中创建精美内容，其实并不复杂
块编辑器（Gutenberg）的设计初衷，就是让你像拖拽积木一样轻松搭建页面和文章，无需任何技术基础。
你可以把它想象成用数字乐高积木搭建。每一块内容——无论是文本、图片还是按钮——都变成一个可以自由移动和自定义的“块”。
猫哥已经使用这个编辑器多年，并帮助了成千上万的用户掌握这一系统。
在本教程中，我们将为你展示 WordPress 块编辑器的具体用法。你将学到让内容创建更快的简单技巧，并发现无需任何编码知识就能让网站看起来更专业的功能。
注意：本文讨论的是用于编辑文章和页面的块编辑器。如果你想了解如何用块编辑整个网站，请查看猫哥的完整 WordPress 全站编辑指南。
块编辑器（Gutenberg）与经典编辑器的区别
最大的区别在于内容创建方式。经典编辑器像一个简单的文本编辑器，而块编辑器则是一个现代化的页面构建器。
| 功能 | 经典编辑器 | 块编辑器（Gutenberg） |
|---|---|---|
| 内容结构 | 单一文本字段（类似 Word） | 每个元素独立成块 |
| 布局选项 | 有限（需插件实现多列） | 拖拽式列、组、行 |
| 媒体处理 | 基本对齐（左、中、右） | 全宽图片、画廊、封面块 |
| 移动端响应 | 通常需要自定义 CSS | 块自动堆叠，默认适配手机 |
| 短代码 | 直接粘贴到文本中 | 专用短代码块，代码更整洁 |
块编辑器让你对内容的视觉效果有更多控制，可以构建经典编辑器无法实现的复杂布局。
块编辑器相比经典编辑器的优势
块编辑器提供更快、更直观的内容创建方式，消除了许多单一功能插件，这些插件以前常常拖慢网站速度。
- 媒体丰富：内置强大的媒体选项，如封面块（用于英雄图）和媒体与文本块，这些功能以往需要自定义代码才能实现。
- 减少插件臃肿：表格、按钮、多列等内置核心块，无需再安装独立插件。
- 默认移动端响应：经典编辑器中复杂布局在手机上常失效，块编辑器的列块会自动垂直堆叠，确保访客体验流畅。
- 可视化编辑：编辑时即可看到最终效果，无需频繁切换“预览”按钮。
- 面向未来：块编辑器是 WordPress 全站编辑和块主题的必备基础，经典编辑器无法使用这些新设计工具。
本教程内容概览
- 使用 Gutenberg 块编辑器
- 用块编辑器创建新文章或页面
- 如何添加块
- 操作块的方法
- 将块组织成组和列
- 保存和复用内容（同步模式）
- 发布和管理选项
- 插件选项在块编辑器中的集成
- 常用块添加示例
- 探索其他内容块
- 高手进阶技巧
- 为块编辑器添加更多块
- 常见问题解答
- 视频教程
- 额外资源
使用 Gutenberg 块编辑器
块编辑器设计直观且灵活。虽然界面与经典编辑器不同，但它能完成所有经典编辑器能做的事，同时做得更快、更优雅。
用块编辑器创建新文章或页面
像往常一样，点击后台“文章” > “写文章” 菜单。如果要创建页面，点击“页面” > “新建页面”。
这将启动块编辑器。
如何添加块
每个文章或页面的第一个块是标题。你可以用鼠标点击标题下方，或按键盘 Tab 键将光标移到标题下方开始写作。
默认下一个块是段落块，你可以直接开始写作。如果想添加其他类型的内容，可以点击编辑器左上角的“添加块”按钮（+），或点击某个块下方或右侧的“+”按钮。
点击后会出现添加块菜单，顶部有搜索框，下方是常用块。你可以点击标签浏览块分类，或输入关键词快速搜索。
也可以使用键盘快捷键：输入 / 然后搜索块，按回车插入。
操作块
每个块上方都有一个工具栏，按钮会根据当前块类型变化。例如，段落块显示基本格式按钮：文本对齐、加粗、斜体、插入链接等。
每个块还有自己的设置面板，出现在编辑界面右侧栏。例如段落块可以设置文本、背景、链接颜色以及排版。
你可以通过拖拽或点击工具栏的上下箭头来移动块的位置。
将块组织成组和列
块编辑器提供便捷工具来管理布局。你可以按住 Shift 键同时点击多个块，然后点击工具栏中的块类型按钮，将其转换为“组”或“列”。
之后可以对整个组应用样式，如对齐和间距。
专业提示：处理组和列时，直接选择嵌套块可能困难。建议使用“列表视图”（点击顶部工具栏的三个横线图标），可以清晰看到所有块的结构，方便选择嵌套组并移动。
你也可以直接添加空的“组”或“列”块，然后往里面填充其他块。
每列中可以添加任意类型的块，从而创建适用于不同场景的精美布局。
保存和复用内容（同步模式）
块编辑器最强大的功能之一是可以保存内容并在全站复用，这就是“同步模式”（以前称为可复用块）。
同步模式是一个块或一组块，你可以在多篇文章和页面中使用它。编辑同步模式时，所有使用该模式的地方会自动更新。非常适合需要保持一致的内容，如行动号召框或联盟披露声明。
创建方法：选择要保存的块，点击块工具栏的三点菜单，选择“创建模式”。
弹出窗口中，为模式命名并分配分类。最重要的是确保“同步”选项开启，这样模式才会全局更新。
提示：你也可以将整个组和列保存为可复用块，这样就能保存整个区块并随时使用。
创建后，在另一篇文章或页面中，点击块插入器（+），在“模式”标签下找到它，或直接搜索名称。
模式让网站所有者轻松添加常用元素，如行动号召、社交媒体按钮、横幅等。你的主题或插件也可能自带模式，或者你可以在 WordPress 块模式库中找到他人创建的模式。
发布和管理选项
每篇文章包含元数据，如发布日期、分类、标签、特色图片等。这些选项都整齐地放在编辑器右侧栏。
插件在 Gutenberg 中的选项
WordPress 插件可以利用块编辑器的 API 将设置集成到编辑界面。一些流行插件自带块，例如联系表单插件 WPForms 允许你通过块添加表单。
其他插件也可能在块编辑器界面添加设置，例如 All in One SEO 插件可以在编辑器底部编辑 SEO 设置。
如果你使用 WooCommerce 经营在线商店，它也有自己的块，可以让你在文章和页面中添加产品。
常用块添加示例
1. 添加图片
使用“图片”块，上传或从媒体库选择。也可以从电脑拖拽图片到编辑器，它会自动创建图片块。
在块设置中，可以添加替代文本、选择图片尺寸、添加链接等。
2. 添加链接
在段落块或其他文本块中，工具栏有“插入链接”按钮。也可以使用快捷键 Command+K（Mac）或 Ctrl+K（Windows）。
3. 添加图片画廊
使用“画廊”块，上传或选择多张图片即可。
4. 添加短代码
所有短代码仍然有效，但建议使用专用的“短代码”块，避免格式问题。
探索其他内容块
1. 媒体与文本块
轻松将图片和文字并排显示。
2. 按钮块
快速添加按钮，设置链接、颜色等。
3. 封面块
添加宽幅封面图片，可设置叠加颜色或固定背景实现视差效果。
4. 表格块
无需插件即可创建表格，选择行数和列数即可。
5. 多列块
创建最多6列，每列可包含任意块，且自动适配移动端。
高手进阶技巧
1. 将块工具栏移到顶部
点击右上角的三点菜单，选择“顶部工具栏”选项。
2. 使用键盘快捷键
输入 / 快速搜索块。点击右上角三点菜单 > “键盘快捷键”查看所有快捷键。
3. 拖拽媒体自动创建块
将图片或视频文件拖拽到编辑器，会自动创建对应的块。拖拽多个图片则创建画廊块。
4. 嵌入第三方内容
直接粘贴 YouTube、Twitter、Vimeo 等链接，会自动创建嵌入块并显示内容。
注意：直接粘贴链接对 Facebook 和 Instagram 无效，因为它们的 API 已更改。需要使用 Smash Balloon Social Photo Feed 等插件来启用 oEmbeds。
为块编辑器添加更多块
WordPress 块编辑器允许开发者创建自己的块。一些优秀的插件提供了额外块，你可以通过安装插件来扩展功能。例如，Hostinger 等服务器 上的 WordPress 网站可以轻松安装这些插件。
如果你对 SEO 优化感兴趣，可以查看 猫哥的 GEO/SEO 优化指南。