古腾堡 WordPress 编辑器的完整剖析
已发表: 2022-03-10似乎古腾堡最近在 WordPress 世界中一直是一个有争议的术语。 被誉为今年 WordPress 5.0 最重大的变化，古腾堡编辑器收到了来自网络开发人员和普通民众的不同反应。 所有这些混乱都让我们很难看到古腾堡的真实面目。 因此，我将尝试一劳永逸地消除一些混乱。
在本文中，我将介绍以下内容：
- 什么是古腾堡？
- 不仅仅是编辑
- 古腾堡在 WordPress 中有何变化？
- 安装古腾堡
- 详细探索古腾堡
- 优点和缺点
- 了解兼容性问题
- 古腾堡是未来
- 最新消息和更多资源
1. 什么是古腾堡？
Gutenberg 以发明机械印刷机的 Johannes Gutenberg 命名，由 Matt Mullenweg 在 WordCamp Europe 于 2017 年介绍给世界。本质上，Gutenberg 是一个新的 WordPress 编辑器，具有数十种尖端功能。 它简化了普通非技术用户的网站创建和编辑。
它赢得了多项赞誉，从“WordPress 的新发布体验”到“网站创建的未来”。 一些怀疑论者认为它是 WordPress 棺材上的钉子。 除了所有这些喋喋不休之外，古腾堡将不仅仅是 WordPress 的编辑器（我将在接下来讨论）。
它允许网站创建者使用块构建网站，块是小型拖放单元。 因此，它取代了当前不一致和分散注意力的定制过程。 它还启用了 HTML 标签，如section和figure ，输出纯 HTML。 在撰写本文时，Gutenberg 仍然是一个插件。 但是，社区计划今年将其与 WordPress 5.0 合并。
2. 不仅仅是编辑
Gutenberg 不仅仅是一个编辑器，因为它允许您以可定制的块或块处理网站内容。 您无需精通 HTML 或编写简码。 您可以从单个控制台控制网站的整个布局（后端和前端）。
这个新的编辑器试图结合页面构建器插件（如 Divi 和 Visual Composer）以及自助平台（如 Medium、Wix 和 Squarespace）的最佳功能。 因此，就像那些页面构建器插件一样，您可以通过单个界面处理多列布局。
这是否意味着 Divi 和 Beaver Builder 等插件的终结？ 这是另一篇文章的主题，但简短的回答是否定的。 Gutenberg 不太可能完全取代这些插件。 即使古腾堡成为默认编辑器，您也可以继续使用它们。
3. 古腾堡在 WordPress 中有何变化？
Gutenberg 编辑器的唯一目的是为当前的开放文本编辑器提供替代方案，更不用说难以记住的短代码了，它具有敏捷和可视化的用户界面 (UI)。 因此，与当前的 WordPress 编辑器不同，您不必：
- 从媒体库导入图像、多媒体和批准的文件或添加 HTML 短代码；
- 复制和粘贴嵌入的链接；
- 为不同插件的专用资产编写简码；
- 创建要添加到帖子或页面顶部的特色图像；
- 添加小标题的摘录；
- 为页面侧面的内容添加小部件。
简而言之，古腾堡不会改变 WordPress 的功能。 但是，它确实改变了网站所有者（或创建者）与之交互的方式。 您将使用简单的块，而不是大量的简码和元框。
什么是块？
将块视为新编辑器的最基本（因此是最小）单元。 它们将成为 WordPress 5.0 的基石。 换句话说，所有内容——包括内容、图像、引用、画廊、封面图像、音频、视频、标题、嵌入、自定义代码、段落、分隔符和按钮——都将变成不同的块。 因为您可以拖放每个块，所以识别这些项目并将它们放置在页面上变得容易得多。
4. 安装古腾堡
您可以直接从 WordPress 存储库下载最新版本的古腾堡。 您也可以在 WordPress 仪表板的“添加新”插件下搜索它。 我建议将它安装在您的临时环境中。 但是，您需要最新版本的 WordPress（4.8 版或更高版本）才能安装 Gutenberg 编辑器。
- 登录您的 WordPress 管理仪表板。
- 转到仪表板左侧的插件菜单。
- 单击“插件”以打开“添加新”菜单。
- 在位于左上角的搜索框中输入“Gutenberg”。
- 您将在结果中看到 Gutenberg 插件。
- 单击“立即安装”按钮。
- 单击“激活”按钮以启动插件。
5. 深入探索古腾堡
安装并激活后，Gutenberg 将在左侧菜单栏中显示一个图标。 当您第一次启动它时，您会看到一个新的示例帖子，标题为“Gutenberg Demo”。 您可以在创建自己的演示帖子之前练习。
A. 新增
转到 WordPress 仪表板左侧菜单栏中的“帖子”。 新职位将首先在古腾堡推出。 您可以稍后在经典编辑器和 Gutenberg 中对其进行编辑。
B. 编辑
转到“帖子”菜单，将鼠标悬停在已保存的帖子上，以查看在两个编辑器之间进行选择的选项。 虽然经典编辑器选项暂时可用，但很可能会随着 WordPress 5.0 的推出而被删除。
C. 在编辑器之间切换
您还可以在编辑帖子时在两个编辑器之间切换。 点击右上角的下拉菜单，在可视化编辑器模式和文本编辑器（即代码）之间切换。 或者，您也可以使用快捷键Ctrl + Shift + Alt + M在编辑器之间切换。
文本编辑器：
可视化编辑器：
D. 复制所有内容
此功能允许您一键复制 HTML 版本中的所有内容。 您可以通过单击仪表板右上角的下拉菜单在两个编辑器中打开此功能。
E. 内容结构
此功能允许您计算整个帖子中的字数。 您还可以通过单击查看标题、段落和块的数量。 单击左上角的信息图标 (i)。
F. 重做和撤消
您可以在信息图标 (i) 旁边找到这些选项。 它们允许您撤消或重做最后一个命令。
G. 页面和文档设置
这允许您更改各种页面和文档设置。 您可以在右侧的菜单栏中找到它。 您可以进行以下调整：
- 将帖子设为公开或私密。
- 更改发布日期。
- 选择帖子的格式。
- 添加或编辑类别和标签。
- 上传特色图片。
- 写一段话。
- 启用和禁用评论、pingbacks 和 trackbacks。
H. 坚持首页
如果您正在运行博客，此功能将派上用场。 当您在文档设置中启用此功能时，该特定帖子将始终显示在您博客的首页上。 只需将其关闭即可将其从首页中删除。
一、使用块
如前所述，块是新古腾堡编辑器的基本单元。 要有效地使用 Gutenberg，您需要了解如何使用这些块。 我将一一介绍主要块。 单击重做/撤消选项旁边的加号 (+) 按钮以打开块菜单。
通用块
通用块允许您添加创建丰富 UI 所需的元素。
- 段落
段落块具有一些出色的功能，例如自定义字体大小、首字下沉、背景颜色和文本颜色等。 您还可以在此处添加更多 CSS 类。
- 图片
此元素带有一项新功能，可让您在图库和图像布局之间切换。 您还可以更好地控制图像，因为您可以为每个图像设置特定的尺寸尺寸、百分比尺寸比和替代文本描述。
- 其他元素包括：
- 引号，
- 画廊，
- 封面图片，
- 标题，
- 列表，
- 声音的，
- 文件，
- 副标题，
- 视频。
格式化
顾名思义，这些块包含所有格式化工具。
- 桌子
使用自定义 HTML 代码添加表格是一项乏味的工作。 但是，使用表格块，任务要容易得多。 您无需编码即可添加和删除表格的行和列。
- 自定义 HTML
您可以在 Gutenberg 中使用自定义 HTML 代码。 好的部分是您可以插入代码并在块本身中查看预览。
- 其他元素包括：
- 代码，
- 经典的，
- 预格式化，
- 拉报价，
- 诗。
布局
发挥您的想象力，使用此块创建令人惊叹的布局。 此块中的每个元素都具有出色的功能。
- 按钮
您可以使用此块添加“立即订阅”和“立即购买”等按钮。 它有不同的选项，包括对齐方式和字体样式。 您还可以设置按钮的背景颜色和形状。
- 列（测试版）
在基于代码的编辑器中创建列既费时又费力。 此块允许您添加文本列。 您可以在一行中添加一到六列。
- 其他元素包括：
- 阅读更多，
- 分页符，
- 分隔器，
- 垫片。
小部件
这些块允许您添加档案、类别、最新帖子和最新评论，只需单击页面上的任意位置。 您还可以在不进行任何编码的情况下调整这些元素。
- 最新的帖子
使用此块元素，您可以在网格视图或列表视图中显示帖子，按类别组织它们，并按字母顺序或根据发布日期对它们进行排序。 您还可以选择显示发布日期。
嵌入
您可以使用这些块轻松访问任何嵌入。 无论您想添加 YouTube 还是 Twitter 链接，都非常简单快捷。 您只需将 URL 粘贴到给定的空白处，Gutenberg 就会为您嵌入代码。 以下是插入 YouTube 链接的示例：
可重复使用的块
可重用块为开发人员提供了改进的可用性。 您可以将任何块转换为可重复使用的块，以便您可以在不同的位置使用它。 您可以对其进行编辑并再次将其另存为新的可重用块。
您还可以查看可重用块的预览。 所有可重复使用的块都在“共享块”选项下可用。 最重要的是，您可以随时将一个变回常规块。
最常被使用
在此选项下，您将看到最常用的块，以便快速访问。 或者，您可以使用搜索框按名称查找块。
J. 编辑块
要编辑任何块，请通过单击块的右上角打开下拉菜单。 您将看到不同的选项，包括编辑为 HTML、复制和添加到可重用块。
K. 插入块
使用此功能，您可以随时插入新块。 当您将鼠标移到一个块上时，您将看到一个加号图标 (+)。 单击它以插入一个新块。
L. 斜线自动完成
斜线自动完成功能在 Gutenberg 1.1.0 和更高版本中可用。 您可能已经熟悉 Slack 中的类似功能。 添加它是为了减少创建新块所需的指向和单击量。
当您打开一个新块时，只需按键盘上的/ （斜杠键）即可选择任何自动完成选项。 它仅适用于默认段落块，但将来可能会成为其他类型块的一部分。
M. 移动方块
Gutenberg 使您能够上下移动每个块。 您可以使用箭头（在每个块的左侧）垂直移动它们。
6.古腾堡的优点和缺点
优点
- 为博客文章或网站制作自定义布局不需要任何技术技能。 它像 Medium 一样工作，因此寻求这种风格和用户友好编辑体验的人会喜欢它。
- 它允许您创建一致且先进的设计，而无需过多依赖 TinyMCE。
- 此外，块是一个很好的概念。 它们允许非开发人员直观地制作复杂的布局。 如果您是 WordPress 新手或对它一无所知，您仍然会喜欢它。
- Gutenberg 编辑器本身在移动设备上运行良好（它是响应式的）。 与其前身不同，它允许您在旅途中进行快速编辑。 事实上，精通移动设备的开发人员可以做的不仅仅是一些快速编辑。
- 事实证明，增加的屏幕空间对许多开发人员来说不会分散用户的注意力。
- 核心开发人员仍然可以使用 HTML5 创建自定义的可重用块。 因此，对于极客和非技术用户来说，这似乎是双赢的。
缺点
- 目前，WordPress 编辑器的 beta 版本不支持 Markdown。
- 它仍然不支持响应式列。 您将需要进行一些自定义编码以使此功能具有响应性。 因此，目前无法在移动设备上使用此功能。
- 目前设计布局选项不足。
- 对于某些 WordPress 用户来说，兼容性问题可能是一个重大问题。
- 您只能获得对元框的部分支持，但是，开发人员正在努力扩展元框支持。
- 向后兼容性将成为大多数开发人员的主要关注点。 它将破坏当前的插件和主题，尤其是那些需要与 TinyMCE 集成的插件和主题。
7. 了解兼容性问题
尽管古腾堡简单而灵活，但它可能不是每个人的一杯茶。 大多数 WordPress 开发人员可能会发现很难使用，尤其是在开始时。 他们需要重新训练自己的反应能力以适应新的用户体验。
- 由于向后兼容性问题，您将需要更新许多插件和主题，以确保它们与新编辑器完全兼容。
- 目前，区块更侧重于内容。 因此，古腾堡对自定义网站的布局缺乏精确性和控制力。
- 简码被简码块替换。 但是，您仍然可以从小部件块添加短代码。
- 元框将以新名称和新 UI 提供。 冲突的元框可能会导致经典编辑器而不是 Gutenberg 发出警报。 虽然这个系统可能会有所帮助，但 Gutenberg 将不支持某些元框。
- Gutenberg 支持自定义帖子类型并保持向后兼容。
- 一旦将 Gutenberg 集成到 WordPress 核心中，您将无法关闭它。 但是，您可以随时使用官方插件禁用它。
8. 古腾堡是未来
与流行的观点相反，古腾堡不是当前文本编辑器的替代品。 这是一种建立网站的新方法。 我喜欢把它想象成 WordPress 的 Facebook。
您无需成为计算机极客即可在 Facebook 或任何其他社交媒体平台上发布内容。 Gutenberg 只是将这种简单性和灵活性带入 WordPress 的一种方式，因此人们无需编写代码即可创建和发布网站。 这就是为什么我认为这将是未来，不仅适用于 WordPress，而且适用于整个网络。
当然，古腾堡还有很长的路要走。 人们（包括我）在其实施方面遇到了问题，但很快我们将随处可见 Gutenberg-ready 主题、插件和工具。 然而，你必须从某个地方开始。 因此，您不妨从一开始就参与到这一变化中。
9. 最新消息和更多资源
如果您有兴趣从一开始就乘坐古腾堡火车，这里有几个链接可以找到最新的嗡嗡声。 请记住，这些网站都没有得到 WordPress 的正式认可。
- 古腾堡新闻
- 古腾堡枢纽
- 古腾堡时报
对于官方更新和新闻，您可以尝试以下操作：
- “古腾堡，或忒修斯之船”，马蒂亚斯·文图拉·鲍塞罗
- “编辑器技术概述”，Matias Ventura Bausero，WordPress.org
- “设计原则”，WordPress.org
- “wp-post-grammar”，丹尼斯·斯内尔
- “#gutenberg（开发聊天摘要：6 月 27 日），”Jeffrey Paul
- “古腾堡简介”，WordPress.org
包起来
不管你喜不喜欢，Gutenberg 即将推出 WordPress 5.0。 一定要尝试成为网络上正在进行的讨论的一部分。 它肯定会有所帮助。 事实上，当你在做的时候，试着用你的技能来加速开发过程。 同时，让我知道这篇文章是否对这个话题有所启发。 将您的疑问和建议放在评论部分。 我很想继续对话。