关于 WordPress 块编辑器我又爱又恨的 12 件事

已发表: 2020-05-20

2017 年,Gutenberg 的第一个版本推出,乐趣和测试开始了。 Gutenberg 是为四个阶段的过程选择的项目名称,该过程将触及 WordPress 的每一部分:编辑、定制、协作和多语言(来源)。 第一阶段的一部分是摆脱旧的经典编辑器并采用新的基于块的编辑器

从 WordPress 5.0 开始,块编辑器已合并到核心中,并且是您进行全新 WordPress 安装时的默认编辑器。 这个有官方名称吗? 有点。 我选择将其称为“块编辑器”,因为 Gutenberg 应该是围绕未来变化的整个项目。 但是围绕名称应该是什么进行了一些有趣的讨论:#4681 和 #20407。

我认为分享我对块编辑器的想法可能会很有趣,因为我已经断断续续地使用它三年多了。 几个月前,我终于完全放弃了经典编辑器。 这就是为什么。

  • 我喜欢 WordPress 块编辑器的地方
  • 我讨厌 WordPress 块编辑器的事情

我喜欢 WordPress 块编辑器的 8 件事

不可能列出经典编辑器和块编辑器之间的所有差异。 作为作家和网站建设者,这些事情对我的工作流程产生了个人影响。 现在我不想没有他们生活!

Markdown 支持更好

最后, WordPress 编辑器支持在 Markdown 中粘贴的功能。 作为一名作家和临时开发人员,我每天使用的所有其他工具多年来都支持 Markdown。 这包括熊应用程序、Trello、Github 等。所以在其他地方使用 Markdown 真的很令人沮丧,然后无法将其复制/粘贴到 WordPress 中而无需重新格式化。

现在有了 WordPress 块编辑器,我可以全面使用许多相同的语法。 老实说,这几乎改变了生活。 几年前编辑应该是这样的。

编辑器仍然不支持开箱即用地仅在 Markdown 中编写的功能,但它已经实现了。 至少到了不再让我慢下来的地步。 您还可以使用 Iceberg 之类的插件来添加所有您喜欢的 Markdown 快捷方式。 我还能够在几秒钟内匹配我最喜欢的 Ayu Mirage Bear 主题。 事实上,我使用 Iceberg 编写了整篇博文。

在 WordPress 块编辑器中更好地支持 Markdown
在 WordPress 块编辑器中更好地支持 Markdown

其他 WordPress 插件,如 EditorsKit 和 JetPack,也可以添加 Markdown 支持。

不再重新加载

我是那种经常查看我的帖子预览以了解流程及其外观的人。 老实说,可能太多次了。 在经典编辑器中,您必须保存草稿,整个页面将重新加载。 这只是烦人和分心。

在 WordPress 块编辑器中,您在保存草稿或更新帖子时不再需要完全重新加载。 对 AJAX 赞不绝口。 欢迎来到 21 世纪。

不再刷新 WordPress 编辑器
不再刷新 WordPress 编辑器

块是惊人的

我现在喜欢积木。 我完全可以看到它的发展方向。 我花了一段时间,因为一开始我不想喜欢积木,但我终于到了。

最近,我完全用块重建了我们的 Perfmatters 网站,并且能够删除 83 行自定义代码。 这一切都归功于 GeneratePress、GenerateBlocks,当然还有 WordPress 块编辑器。

WordPress 块编辑器中的块
WordPress 块编辑器中的块

我们甚至在我们的新社交分享插件 Novashare 中构建了一个方便的点击推文块。 你所要做的就是输入/nova...并且繁荣,你有你的推文块。

嘿,看,我是一个灰色的推文框。 请给我发微博。 点击推文

其他的小东西,比如能够输入/image ,或/code ,或/quote非常方便!

突出显示它本来应该是这样的

在 WordPress 块编辑器中突出显示现在应该是这样。 例如,假设您有几个加粗的单词。 在经典编辑器中,如果我想取消它们的粗体,我必须突出显示所有单词。

现在,在 WordPress 块编辑器中,我可以简单地单击粗体区域中的任意位置,然后取消粗体字。 它与下划线之类的行为相同。 随着时间的推移,像这样的小事情真的开始累积起来。

在 WordPress 块编辑器中突出显示
在 WordPress 块编辑器中突出显示

文档大纲很聪明,很有帮助

WordPress 块编辑器中的文档大纲功能实际上非常棒! 您可以轻松单击标题以立即将您带到帖子中的该部分。 不仅如此,它背后还有一些逻辑。 在下面的示例中,您可以看到它让我知道了错误的标题级别(从 H2 标题跳到 H4)。 结构方面,我应该先使用 H3。

块编辑器文档大纲
块编辑器文档大纲

在图像上添加标题非常容易

当谈到图像标题时,我是一个坚持不懈的人。 不仅出于 SEO 的目的,而且它们也是一种方便且微妙的方式来在获取外部图像时对其进行归因。

在经典编辑器之前,您必须上传图片,然后单击图片以显示新窗口,然后输入您的标题。 现在在 WordPress 块编辑器中,您可以简单地上传图像并在其下方键入标题。 我什至无法计算这些年来我上传到 WordPress 网站的图片数量; 它必须是数万。 所以再一次,小事情加起来!

写得更好
写得更好(图片来源:Pinterest)

更好的视图可供选择

使用 WordPress 块编辑器可以在写作方面提供更多视图供您选择。 毕竟,这是新编辑器的一大重点,就是改善整体写作体验。

在我看来,你有像 Medium 这样的竞争对手,它们让旧的经典编辑器大吃一惊。 值得庆幸的是,现在 WordPress 块编辑器的行为更像其他一些第三方写作平台。

三种不同的观点包括:

  • 顶部工具栏:在一个地方访问所有块和文档工具。
  • 聚光灯模式:一次专注于一个块。
  • 全屏模式:工作时不会分心。

如果您选择了所有三个,下面是它的样子。

所有三个 WordPress 块编辑器视图
所有三个 WordPress 块编辑器视图

我实际上是 Spotlight 模式和没有顶部工具栏的全屏模式的忠实粉丝。

我最喜欢的 WordPress 块编辑器视图
我最喜欢的 WordPress 块编辑器视图

终于有人想到了ID

在经典编辑器中添加 HTML 锚链接非常烦人,因为您必须切换到代码视图才能添加 ID。 你必须用 HTML 来做这件事。 这使得它变得非常麻烦,这也是人们想要添加锚链接的一个重要原因,只需安装一个 WordPress 插件以使其更容易。

在 WordPress 块编辑器中,您终于可以在同一视图中添加 ID 了! 不需要插件。 万岁。

添加 HTML 锚点 ID
添加 HTML 锚点 ID

我讨厌 WordPress 块编辑器的 4 件事

显然,您已经可以看出我现在是 WordPress 块编辑器的粉丝。 但是,有几件事我不喜欢。 我希望这些在块编辑器的未来版本中得到修复。

我的光标在这里,现在它在那里

这个很难描述,但是任何使用 WordPress 块编辑器一段时间的人都应该能够知道我在说什么。

当您单击不同的块时,光标并不总是正确地跟随您。 有时它会来回跳动,你必须重试两三次,非常小心光标的位置。 否则,您可以轻松地开始输入错误的块。 或者更糟糕的是,有时它会立即将您滚动回顶部。

我已经向数十人证实了这种奇怪的行为,所以我知道这不仅仅是我。

挫折
沮丧(图片来源:Memedroid)

让主题覆盖编辑器可能并不适合所有人

如果您让主题覆盖编辑器样式,它的外观或感觉可能并不总是相同。 您的偏好可能会有所不同,具体取决于您使用块编辑器执行的操作以及您是否在许多不同的站点之间来回跳转。

我管理着很多不同的 WordPress 网站,我更喜欢剥离主题样式并回到原生块编辑器样式。 这样一来,我在所有网站上都有类似的感觉,即使是在我使用积木构建和设计时也是如此。

例如,我在所有网站上都使用 GeneratePress 主题。 因此,我添加了以下过滤器以默认恢复为原始块编辑器样式。

 add_filter('generate_show_block_editor_styles', '__return_false');

下面是它的外观之前和之后。

之前的块编辑器(主题覆盖样式)

WordPress 主题覆盖编辑器样式
WordPress 主题覆盖编辑器样式

之后的块编辑器(剥离主题样式)

块编辑器默认样式
块编辑器默认样式

语法不能正常工作,可能永远不会

我是 Grammarly 的忠实用户。 然而,自从新的 WordPress 块编辑器问世以来, Grammarly 一直无法正常工作。 它有时会找到东西,有时却找不到。

我在 Twitter 上也看到了用户类似的抱怨。 据我所知,我认为这与每个块如何完全分开有关。 因此,Grammarly 不能总是看到完整的上下文。 我还认为它只是在扫描基于 React.js 的编辑器时遇到了问题。

老实说,我对他们解决这个问题并不抱太大希望。 我现在尝试在他们的支持下以及在 Twitter 上提出这个问题。 WordPress 团队说这是语法结束的事情。

我很惊讶地从评论这篇文章的 Jakab 那里得知,其他解决方案(例如 ProWritingAid 的扩展)在块编辑器中工作得很好。

无法再查看单个帖子的评论

这可能不是编辑器本身的变化,而是 WordPress 5.0 和 WordPress 块编辑器的推出发生的变化。 以前,您可以滚动到您正在处理的帖子的底部并查看待处理的评论。 这是在关注手头主题的同时赶上评论的好方法。 这不再存在。

您现在必须从主仪表板窗口回复评论,或单击“所有帖子”屏幕上的评论图标。 这样做的问题是,您还可以阅读文章的内容。 因此,当我回答评论时,我只是开始在另一个窗口中打开帖子以供参考。

WordPress 块编辑器中的待处理评论
WordPress 块编辑器中的待处理评论

我在这篇文章中提出这个问题的原因是很多时候我会根据评论的反馈在编辑器中更正或更新内容。 有人认为这个工作流程需要改变,我猜,并且不再在同一个窗口中。

概括

我真的很想听听大家的反馈。 您喜欢新的 WordPress 块编辑器的发展方向吗? 你喜欢和讨厌它的哪些方面? 在评论下方留下您的想法。