Gutenberg Changelog 第 131 期解读 23.1 至 23.3 及 WordPress 7.1 测试重点

在 Gutenberg Changelog 第 131 集中，Birgit Pauli-Haack 欢迎 Isabel Brison，探讨 Gutenberg 插件 23.1、23.2 和 23.3 版本的最新进展，以及迈向 WordPress 7.1 的开发进度。主持人重点介绍了最近的测试征集，其中包括协作式编辑——此前因稳定性顾虑从 7.0 延期——以及为图像区块推出的新媒体编辑器模态框。

Isabel Brison 分享了全新响应式全局区块样式的见解，该功能允许用户按设备断点自定义样式，还介绍了区块编辑器中布局和尺寸控件的更新。她鼓励用户提供反馈，因为这些功能将在即将推出的 WordPress 7.1 中继续迭代。本期节目涵盖多项稳定化工作，例如得到改进且更易用的媒体编辑器和裁剪工具，以及无障碍方面的进展，尤其是标签页区块。

主持人还讨论了仪表板小部件、内容类型管理方面的实验，以及通过新的管理界面组件赋能插件开发者。鉴于即将推出众多新功能，两人都强调了社区反馈和测试的重要性。本期节目最后介绍了文档改进、React 19 集成等实用说明，并提醒听众接下来将迎来短暂的暑期休息。

节目说明 / 文字稿

• 编辑： Sandy Reed
• 标识： Mark Uraine
• 制作： Birgit Pauli-Haack

节目说明

特别嘉宾：Isabel Brison

• GitHub @tellthemachines
• WordPress @isabel_brison
• X（原 Twitter） @ijayessbe

测试征集

• 宣布面向 7.1 的协作式编辑推广工作
• 媒体编辑器模态框：测试征集
• 测试征集：客户端媒体处理

已发布的版本

• WordPress 7.0 “Armstrong”
• WordPress 7.0 指南
• WordPress 7.0 真实来源
• Gutenberg 中暂时撤销的 React 19 升级

Gutenberg 版本发布

• Gutenberg 23.1 有哪些新内容？（5 月 7 日）
• Gutenberg 23.2 有哪些新内容？（5 月 21 日）
• Gutenberg 23.3 有哪些新内容？（6 月 3 日）

保持联系

• 你喜欢本期节目吗？请给我们写一条评价
• 在 X（现称 Twitter）上联系我们，或发送私信提出问题。@gutenbergtimes 和 @bph。
• 如果你有问题或建议，或者希望我们收录某些新闻，请发送至 changelog@gutenbergtimes.com。
• 请在 iTunes 上给我们写一条评价！（点击此处了解详情）

文字稿

Birgit Pauli-Haack：欢迎收听我们的第 131 期 Gutenberg Changelog。我们将讨论 Gutenberg 插件 23.1、23.2 和 23.3 版本。WordPress 7.1 有多项测试征集，此外还有更多内容。我是本期主持人 Birgit Pauli-Haack，也是 Gutenberg Times 的策展人，并且是由 Automattic 赞助的 WordPress 开源项目的全职核心贡献者。今天，Isabel Brison 又从悉尼加入我们。Isabel 是 Gutenberg Project 的资深核心贡献者和 JavaScript 开发者。欢迎回到节目，Isabel。感谢你参加本期节目。你好吗？

Isabel Brison：我很好。谢谢你的邀请。能来这里总是很愉快。

Birgit Pauli-Haack：你能来我非常高兴，因为你和你的团队一直在打造即将登陆 Gutenberg 的几项最令人期待的功能。大家已经等待很久了。等谈到更新时，我们会深入讨论。悉尼怎么样？

Isabel Brison：现在是冬天，又冷又下雨，你懂的，就是平常那样。

Birgit Pauli-Haack：照常的吗？是的。这项技术怎么样？我知道你会去参加那里的聚会。这些是 WordPress 聚会，还是其他技术聚会？

Isabel Brison：我会参加各种技术聚会。数量不算很多，所以我会去参加比如 JavaScript 聚会，那里还有一个很不错的技术领导者聚会。即使我不使用 Python，我也很喜欢参加 Python 聚会。那里的社群很温馨，而且会有一些有趣的演讲。所以我想，基本就是有什么就参加什么。

Birgit Pauli-Haack：哦，不错。是的，我是在慕尼黑了解到这个技术社群的，后来与当地一个 Claude 聚会社群建立了联系。那次活动挺有意思的，在工业大学或设计大学举行，地点会轮换，但很有意思。是的，他们会有闪电演讲。大概是 20 分钟的演讲，非常酷。我觉得我们确实应该多出去走走。

Isabel Brison：是的，我喜欢下班后出去走走。你知道，即使只是去听一些技术演讲，也能呼吸一下新鲜空气、认识新的人。

Birgit Pauli-Haack：是的，这很好。好的。 

公告

好了，我们有几个公告。WordPress 7.0 已经于两周前发布，而我们正大步迈向 7.1。Beta 1 计划于 7 月 15 日推出。这时间有点……呃，只剩六周了。

Isabel Brison：是的。那我们很快就能继续推进了。

Birgit Pauli-Haack：贡献者已经在着手开发下一个主要版本了。官方路线图规划文章也正在筹备中。团队已经进入组建发布小组的最后阶段；从 Gutenberg 插件的发布情况来看，我们也能大致了解 7.1 可能包含哪些内容，以及哪些内容没能进入 7.0。所以我们会……不过这就是 Web，对吧？Web 给我一种日式设计的感觉。没错，有点侘寂。没有什么是完成的，没有什么会永远持续，也没有什么是完美的。因此我们总有工作要做，而且它总是在变得更好。是的。

Isabel Brison：没错。它仍在不断完善之中。

Birgit Pauli-Haack：它仍在不断完善之中。 

征集测试——WordPress 7.1

目前有两个测试征集活动。其中一个是宣布为 7.1 开展协作编辑推广工作。亲爱的听众们 Many of you 应该还记得，协作编辑，也就是实时协作编辑，从 7.0 中撤下了，因为它对于现有的各种托管环境来说还不够稳定。此前我们曾面向托管环境发起过一次测试征集，现在又发起了一次推广工作方面的征集，以确保 7.1 的所有相关事项都得到妥善处理。 

Anne McCarthy 刚刚在 Make Core 博客上发布了相关信息，所以你现在随时都可以加入。还有一个单独的外展协作编辑频道，你也可以加入。它有点像是整个站点编辑外展项目的模式，该项目持续了两三年。我希望这个项目在发布前不会持续两三年，但确实有更多人在讨论它，以及它应该如何运作。Amy Kamala 曾担任 7.0 的发布协调员，Justin Tadlock 是 Automattic 的开发者布道师兼主题团队代表，他们正在帮助 Anne 协调这些测试通话。Automattic 一些负责企业级工作的团队也会参加。所以没错，这是一个关于协作编辑如何在不同层级运作的更广泛讨论。

Isabel Brison：是的，这是一项规模相当大且复杂的工作。

Birgit Pauli-Haack：是的，如果你对这项功能感到兴奋，就加入频道并直接参与进来吧。我对此也很期待。不过，我只有两三个人处理我的编辑工作，所以我的发布区域里没有 10 到 15 名编辑。 

另一次测试通话涉及已添加到图像区块中的媒体编辑器模态框。大约两周前，Ramon Dodd 发布了一则测试征集，介绍用于图像裁剪器的新模态框。它有点像是区块编辑器中更大版本的图像裁剪功能，因此你不必再使用旧方式。它是让图像符合要求的一种更简单的方法，同时还可以旋转和调整图像大小。它已与 Gutenberg 插件合并。此外，它也随 23.3 结束了实验阶段。因此，任何安装了 Gutenberg 插件的人都可以参与测试。Ramon 对如何测试、查看哪些内容以及如何分享反馈都有非常详尽的说明。其中还有一小段内容介绍了不在此版本范围内的部分。所以对于这个版本，我们当然会在节目展示和说明中分享所有链接。Isabel，你是这个项目的参与者。它让你感到兴奋的是什么？

Isabel Brison：实际上，我没有真正参与过。嗯，不，我……我在最开始讨论选择哪些库，以及是自行开发还是使用第三方库时，帮了一点忙。最初的测试我也参与了一点，但主要是 Ramon 和 Andrew 的工作。现在进入 Gutenberg 的后半部分，实际上全都是他们的工作。我觉得这非常令人兴奋，因为它取代了旧的 Cropper。老实说，我从来都不喜欢它。

Birgit Pauli-Haack：我讨厌旧的 Cropper。

Isabel Brison：我一直搞不懂该怎么使用它。它的用户体验完全不好。而新的这个体验好太多了。它不仅能完成旧 Cropper 的所有功能——我说的是编辑器中的 Cropper，也就是你可以从图像区块工具栏中打开的那个。它也存在于站点标志区块中。因此，你现在可以从这两个区块中打开新工具。它除了具备旧版的所有功能，还能自由裁剪和自由旋转。所以，如果你想把图像旋转 3 度，或者想把它裁剪成任何你喜欢的奇怪宽高比，现在都可以做到，而旧版无法做到。是的，它……它就是顺畅好用太多了。我认为，就键盘无障碍访问而言，它也比旧版更具无障碍性。它……在这方面也更好。所以，全都是优点。是的，他们做得非常出色。

Birgit Pauli-Haack：我只用了一小会儿，惊讶于它如此流畅。是的，我算是。它也比以前直观得多。之前我用 Cropper 时从来不知道该怎么做，总会想，那么我现在该怎么操作？每一次都得思考。而这个工具非常、非常直观，使用和查看起来都非常流畅。所以我对此真的很高兴。我希望它能纳入 7.1。对，我们有那个了。

Isabel Brison：是的，它正在按计划推进，我认为也是。我的意思是，除非发生任何重大自然灾害，否则我认为没有理由不能纳入 7.1。这是一项非常出色的工作。它真的很稳定，而且现在它不再位于实验性标志后面，真实用户正在使用它。如果有任何地方还达不到 100% 完美，我敢肯定会收到大量反馈，而且我们在 beta 1 之前仍有时间继续迭代。

Birgit Pauli-Haack：我真的很感谢 Roman 和 Andrew 深入研究，了解其他图形程序实际是如何做事的，并试图将其中一些体验也引入区块编辑器。所以好的，是的，想深入体验的人可以进行两轮测试。这是一种为 WordPress 做贡献的很好方式，因为它与你使用 WordPress 的方式非常接近。不仅开发者，内容创作者也能更好地帮助测试，机构中工作或为机构客户工作的人也能借此了解整个机制如何运作。这就引出了即将发布的版本。我提到过了。 

即将发布的内容——WordPress 7.0

WordPress 7.0 Armstrong 已发布。我们在此前几期节目中与机构视角、设计师视角和内容创作者视角的各位嘉宾讨论过它。如果需要了解，我们会将链接放在节目说明中。Field Guide 是 WordPress 7.0 官方指南的链接，Gutenberg Times 上的信息来源也包含其中，有所有面向用户的内容。这些是关于 7.0 的最佳信息。过去两周里，我没有看到出现任何重大问题。是的，这是一个非常棒的测试周期，而且延迟了六周。 

实际上，大多数漏洞很早就被发现，或者在 loliso 中发现的，我也不确定。我不知道什么时候会有一个点版本，这通常会在主要版本发布后的几周内进行，但我没有看到相关计划。不过也可能在 WorldCap Europe 之后的 6 月底。 

那么，让我们深入了解 Gutenberg 的发布内容。我们从 Gutenberg 23.1 开始。哦，有一个问题，Isabel，你最喜欢 WordPress 7.0 中的哪个新功能？

Isabel Brison：哦，我不知道。这里有很多有趣的功能，其中一些也由我参与开发。当然，我对自己参与过的功能有一些个人偏爱，其中之一就是。它非常非常细微，或者说比较低调。我们没怎么谈过它，但我为网格区块做了一点实用的小改进，或者更准确地说，是网格布局类型。它让我们能够配置响应式的列数。通过设置列数和最小宽度，你可以指定我希望我的区块最多始终有三列，但在较小的屏幕上可以减少到两列，甚至一列。这是我们以前没有的功能，我对此相当满意。我认为这是个好改进。不过相比之下。哦，还有。确实有很多东西。我认为模式编辑工作会非常实用。还有什么来着？还有一个便笺功能。

Birgit Pauli-Haack：不，我在 6.9 版本中就已经有了。对。

Isabel Brison：哦，对。不，是有什么来着？哦天哪，我把不同版本的发布搞混了。

Birgit Pauli-Haack：对，对，它们有点。一旦发布，这些版本就混在一起了。全都混在一起了。有点。对。是在这个版本还是那个版本？有时候确实会这样。 

Gutenberg 23.1

好，让我们深入了解 Gutenberg 23.1。它于 5 月 7 日发布，由 49 位贡献者完成了 212 个已关闭的 PR。因此，我们确实正在收尾 Gutenberg 的各个版本，或者说收尾 Gutenberg 和区块编辑器的工作。现在它不仅包括区块编辑器，还包括站点编辑器、数据视图，以及设计系统等。所以可以说，Gutenberg 仓库已经扩展到了 WordPress 生态系统的其他领域。不过，首先来看列表中的第一项，它真的很有意思：这些更新日志实际上是自动生成并汇总起来的，其中一项是上传媒体，以及它支持并发的边栏加载上传。这很有意思，因为图片上传时启用多个流存在严重的性能问题，否则你就不必长时间等待图片出现在区块画布中。这对性能来说是一个非常好的改进。

Isabel Brison：对，对。我可以想象，尤其是批量上传的时候。

Birgit Pauli-Haack：所以当你从其他来源复制粘贴内容时，它也有一个功能，可以下载并上传你在其中关联的图片。这个功能也应用在这个并行流上传模块中。所以它真的很酷。你只会因为速度更快而注意到它，除此之外，它不会中断你的工作或造成其他任何影响。

Isabel Brison：对，这里有很多优秀的工作。这也是客户端方面的。我相信，这是原本未进入 7.0、现在正为 7.1 准备推出的客户端媒体处理工作的一部分。这方面主要是 Adam Silverstein 在负责。我没有密切关注，但看起来是一项非常实用的工作，一旦我们设法将其纳入，性能就会得到提升。

Birgit Pauli-Haack：对，Adam Silverstein 为 6.9 版本的花样处理功能也付出了很多工作。 

增强功能

所以，对，我在这里标记了一项增强功能，但我不确定它有多大用处。它面向 WordPress UI 覆盖层，以及 Storybook 上的全局预览样式。WordPress UI 是 WordPress 下一代组件。

Isabel Brison：它某种程度上是组件包的继任者。

Birgit Pauli-Haack：是的。目前两者都在使用，但我看到现在有人在努力迁移、合并这些内容，我不知道该怎么称呼，就是把它们整合到一个东西里。不过，覆盖层和预览样式让你可以在 Storybook 中显示预览，这样你能更好地了解它之后会是什么样子。

Isabel Brison：是的，那应该不错。

Birgit Pauli-Haack：然后，组件、管理界面、UI 组件和对话框都有大量改动。这主要是为使用 WordPress 并创建自己内容的开发者准备的，无论是构建 WordPress 还是为 WordPress 创建插件，都能拥有一套统一的设计系统和统一的组件系统，而不必自己另行设计界面。这些决策已经做好了，你可以在此基础上继续构建。在此之前，包括组件在内的所有东西，每个插件都必须自行设计界面，而现在这真的很棒。

Isabel Brison：是的，有一套可以在扩展时使用的系统会很好。如果你需要为自己的插件构建一个新屏幕之类的，只需使用这些组件，所有东西看起来就会与 WordPress 融为一体。

Birgit Pauli-Haack：这对用户也有好处，因为他们不必思考“这个工具现在怎么用？”或者“现在在这个屏幕上怎么筛选？”因为所有内容都采用统一系统，已经完整构建并且稳定。接下来是笔记功能的一些更新。它目前处于 23.1 版本，主要是重构位置和浮动面板。不过我们会在之后的其他版本中看到，区块库将迎来一些很棒的功能。标签页区块有了更新。我真心希望它能在 7.1 版本中推出。它目前仍受实验标志控制，但现在可以处理重复标签页，也就是标签页上有重复的句柄。它还遵循 WCAG 标签页模式，在重命名区块时实现无障碍。所以，这是一大步无障碍改进，也有助于该功能获得认可。我真的很期待标签页功能进入 Gutenberg，或者进入……

Isabel Brison：据我所知，重命名主要是为了让区块名称符合无障碍标准，或与这些内容的通用称呼一致。PR 中链接了相关的 WCAG 模式，而 WCAG 网站上也有这类示例模式，供人们了解如何正确使用 ARIA 属性，这本身就是一整套科学。其思路是让我们的标签页区块与该模式中的名称一致，使其感觉更加标准化，也让可能在其他地方实现过标签页的人更加熟悉。

Birgit Pauli-Haack：是的。这些标准也是屏幕阅读器会接入并供人们使用的标准。使用屏幕阅读器的人通常会遵循一种共同的模式。是的，这确实提升了标签页区块的无障碍水平。

Isabel Brison：所以一旦稳定下来，这会是一个相当有用的区块。希望如此。

Birgit Pauli-Haack：是的，是的。我知道在过去八年间，不少区块合集从一开始就带有标签页。而它们不会消失，因为任何核心区块的首次迭代都不会像过去六七年间开发的那些区块合集那样功能丰富。是的，下一项是我们之前谈到的图像裁剪器。所以你可以。还有，它通过画布上带拖动手柄的键盘操作实现。因此，你可以使用鼠标完成一些你想用图像裁剪器或图像工具进行的操作。是的，如果你说“图像裁剪器”，听起来就仅限于裁剪，但实际上它还支持旋转等操作的处理

Isabel Brison：以及所有那些功能。

Birgit Pauli-Haack：是的，是的。WordPress 网格包有了一个新 API，但你正在使用的是另一种网格。

Isabel Brison：是的，那不是布局，而是区块布局网格。这是另一种东西，是一种可用于仪表盘 UI 的网格。

Birgit Pauli-Haack：没错。

Isabel Brison：算是管理类的东西。

Birgit Pauli-Haack：是的。这就是为 Gutenberg 中这些新实验提供支持的新 API，也就是仪表盘小组件。我们稍后会稍微谈到这一点。作为插件开发者或 WordPress 的扩展开发者，你现在也可以将它们用于自己的任何仪表盘。如果你的插件有一些数据可视化之类的东西，你可以把它们放进这个网格包中，并显示在插件的设置页面上。Guidelines 也有了一个新 API，现在它有一个公开的 API 方法和一个对应的 REST API 路由。23.1 之后已经有过多次迭代，所以我觉得之后仔细看看会非常有帮助。 

新 API

Guidelines 实际上是一整套面向 AI 的内容类型。基本上，当你的智能体进入 WordPress 网站时，你可以告诉它们该如何处理各种事务。这个网站的目的是什么？编辑指南是什么？是的，如果你允许 AI 进入网站，你也可以规定它们在网站上的行为方式。当你有一些自己无法控制的智能体进入时，这一点确实非常重要。是的，听起来有点吓人。 

但如果你作为网站所有者，将自己的 Claude 连接到网站，就可以在 Guidelines 中列出所有希望 Claude 了解的有关你网站的信息。所以你不必把所有内容都放进提示词里；它会自行找到所有相关信息，而且 Guidelines 也就是你的记忆。因此，如果你使用智能体处理 SEO，或者进行某些内容更新，例如修改标题或标签，或者执行你关于标签和分类的政策，所有这些都可以在 Guidelines 中为你的 AI 明确记录下来，并且它会记住这些内容。不过，看到围绕它的讨论也很有意思。我曾与 Grzegorz 简短交流过；在几百期节目之前，他曾是 Changelog 的联合主持人。我说几百期应该也不算多，但他现在是那个负责思考 AI、记忆等所有相关事务的团队成员之一。听到他的见解非常有意思，因为如果你身处一家代理机构，为多个不同网站工作，但你只有一个 Claude，所以你不会希望一个网站的信息渗透到下一个网站。而这些 Guidelines 能帮助你大致掌握所有情况。所以，这是 AI 带来的一个有趣的问题领域。

Isabel Brison：这就像是为 AI 提供正确的上下文以及恰到好处的上下文信息，让它能在你的网站上发挥最大效能，无论你想用它做什么。

Birgit Pauli-Haack：对，没错。大多数人其实都没那么热衷于此。网站所有者对 AI 没那么感兴趣，但它确实能很好地帮助完成一些事情。我发现它在 SEO 方面很有帮助，在无障碍访问等方面也是如此。多一道复核真的很有用。好，那么 23.1 里接下来是什么？我们有别的内容吗？ 

实验

哦，对，23.1 中有一个自定义分类法实验，涉及自定义文章类型和分类法管理。这个实验最初是……我也不知道这是怎么开始的，但它很可能也是“激进速度月”项目之一。人们当时会说：“好吧，既然 WordPress 3.1 中已经有 API 了，我们大概确实需要内容管理功能。”但当时并没有界面，而一直都有插件可以实现这些功能，无论是自定义 UI、自定义文章 UI，还是 ACF 之类的。但它没有相应的界面。这个实验正是由此而来，旨在稍微拓展一下这方面的边界：把 REST 控制器和界面都加入其中。不过，这肯定还不是该领域的最终结论，因为 WordPress 生态中已经有许多扩展，它们可能不适合这个实验的发展方向。所以，这只是一个原型，属于一种实验性的实现方式。不过你可以去体验一下。你只需要在 Gutenberg 插件中启用这个实验，然后就可以试用并使用它。它使用的是通用 API。 

另一个实验是仪表板。我们稍微谈到过这一点，因为 grid 包就是为它创建的。这个仪表板提供了管理页面路由和侧边栏菜单，作为一个框架，用于在仪表板上添加更多网格。我很想看看。我还没试过，但想看看自己能不能用上。那么，这些仪表板是什么？目前仪表板只有……快速编辑、站点健康状况，以及仪表板上的新闻和一些其他内容，插件也会以某种方式接入其中。但我还没见过，也仍在思考……也许 Claude 能在这件事上帮帮我。快速编辑其实是一个区块编辑器。所以，当你登录 WordPress 站点时，你可能并不想先处理其他所有管理事务，只想创建一篇新文章。那为什么不把它放在仪表板上，直接在快速编辑中创建博客文章呢？快速编辑目前只能使用基于文本的功能，而不能使用区块编辑器。

Isabel Brison：所以，是一个基于区块的快速编辑。你觉得会包含所有区块吗？我认为它需要是区块编辑器一个非常简化的版本。

Birgit Pauli-Haack：对。对。

Isabel Brison：也许可以包括图片、段落之类的，不过那样会很酷。

Birgit Pauli-Haack：对，对。列表。对，有点像大纲工具那种。对，非常快速的那种。对。也许可以再回到空白空间这个话题，但有点像是别用经典编辑器，而是直接用它来构建区块。对。所以有点像是一种免干扰、快速编辑、功能齐全、顶部带工具栏之类的东西。我不知道。等我无聊的时候，我就给 B 加个星标。做个原型。做个原型。对。然后把它合并进去。对。这个。这是很多作者都提到过的事情之一。我不想处理所有那些东西，所以太分心了。对。还有各种公告之类的。所以我就直接开始写我的博客文章吧。不过话说回来，然后还有一份媒体编辑器弹窗的测试征集清单。我们已经讨论过了。23.1 里有一整套这样的东西。还有一大堆大大小小的 PR 被合并了。我觉得这份测试征集会把它的所有细节都列出来，我认为那是。是吗。对于 23.1，你有没有找到什么想进一步讨论的？

Isabel Brison：没有。没什么。除了你已经提到的那些东西。我只是想说。我已经提过，媒体编辑器也适用于站点标识区块。所以你可以在两个区块上测试它，就这些。

Gutenberg 23.2

Birgit Pauli-Haack：那么直接进入 Gutenberg 23.2。它于 May 21st 发布，同时包含 204 个 PR，由 50 位贡献者完成，其中有四位是首次参与。恭喜你们完成了对 WordPress 核心的首次贡献。对，而且你们还获得了徽章。嗯，我想等 7.1 发布时你就会拿到徽章。列出的第一个功能是带有状态的响应式全局区块样式。这太酷了。对。它说了什么？你能带我们了解一下吗？

Isabel Brison：对。所以这是为实现区块响应式样式而开展工作的第一部分。它与状态一起推出，是因为它利用了已经构建好的样式状态 API。Maggie Cabrera 完成了状态 API 的初始工作，她这部分工作只是利用该 API，为极少数具有伪状态的区块添加伪状态样式能力。这个以后或许可以扩展，但不会大幅扩展，因为并非所有区块都需要伪状态，我的意思是悬停、聚焦之类的状态。通常只有交互式区块才需要这些。 

所以 States 是为了满足这种伪元素场景而推出的。但它一直都有进一步扩展的潜力。当初构思这个状态 API 时想到的用途之一，就是利用它为区块创建响应式样式，这只是可能的用途之一。多年来，我一直关注 Gutenberg 仓库里那些讨论如何建立某种机制来定义响应式样式的问题。终于，我有机会着手处理这些问题了。而状态方面的工作已经部分完成，这很棒，因为你知道，有时候启动一件事才是最难的部分。仓库里关于应该如何构建、应该这样做、应该那样做、又不该那样做的讨论数不胜数。我们应该把这个也考虑进去。你知道，你可以一直谈啊谈啊谈，结果始终没有真正开始，因为问题看起来太大、太复杂。而讨论中加入的内容越多，问题就变得越大、越复杂。 

不过，有这么一块小小的垫脚石。这个 states API 已经建好了。于是我就想，既然它已经能用于伪状态，那就试着把它构建成响应式的吧。所以我们把它们称为视口状态。我和同事 Dan Richards 一直在做这个。我们俩开始着手后想，好吧，先把它作为全局样式的基准，然后作为延伸目标，试着也应用到实际的区块实例上。所以最后我们两个都做到了，但在 23.2 中，只有全局区块样式已经准备好。这意味着当你进入站点编辑器和样式区域，在全局样式中进入“区块”时，它只会对区块起作用。目前还不能用于顶层全局样式。我们还不确定是否需要把它添加到顶层样式中。这个问题仍在考虑之中，因为对于很多真正全局的基础元素，比如排版和字号，我们已经有办法在不使用断点的情况下定义响应式效果。我们使用 clamp 函数。你可以定义最大值和最小值，而且几乎可以自由调整，从而在移动设备、平板电脑和桌面上获得不同的字号。因此在一定程度上，你已经具备了响应式功能。以后或许会考虑为这些全局样式启用真正的断点。不过目前它只适用于区块。针对每个区块，你可以进入该区块的全局样式并选择一个状态。顶部有一个新的状态下拉菜单，默认情况下你编辑的是默认状态，也就是不包含媒体查询的状态。然后还有 tablet 和 mobile 状态。tablet 状态只作用于顶层定义的区间，也就是从最高断点到移动端的最高断点。因此，平板样式只会应用于平板到该断点之间，而移动端样式只会应用于自己的断点。基本上就是这样。 

从颜色、排版和间距方面来说，你可以做任何事。所以对于大多数区块，你可以设置排版、颜色，还可以设置尺寸——大多数区块并没有单独的尺寸设置，但你可以设置边距、内边距；如果区块有布局，还可以设置区块间距。你可以按断点定义这些值。有些存在于全局样式中的功能目前还不能使用这套响应式逻辑。当你进入某个断点并选择 tablet 视口时，会发现有些工具可能会被隐藏。例如，Duotone 就是其中之一。你目前还不能按断点设置 Duotone。以后会继续处理这个问题，不过我不太确定有多少人需要按断点更改颜色。响应式样式通常更多是关于间距、尺寸之类的东西。因此，我们更专注于那些我们认为大多数人会真正使用的功能；至于那些更边缘的情况，如果不能开箱即用，我们就会想，好吧，这是以后再解决的问题，我们以后再想办法。Duotone 就是其中之一。

Birgit Pauli-Haack：是的。嗯，很多人等这件事已经等了很久了。所以很高兴你终于开始使用它了。

Isabel Brison：我希望它能派上用场。我只希望大家看到这个之后能说：“好的，好吧，我终于可以把这个东西做出来了，而且确实能用。”还有，请、拜托，请所有正在收听并想试用的人，如果有任何地方无法运行，有任何你不喜欢的地方，或者你觉得“不，不行，这里应该改成另一种方式，因为这样不能用”，请给我们反馈。我们需要反馈，因为现在这个功能已经进入插件版，目标是在 7.1 中推出。在 beta 1 之前，我们还有那六周时间。这六周里，我们会持续迭代这项功能。我们越早收到反馈越好，这样就能知道是否真的有人遇到无法使用的情况，然后我们就可以进行修改。

Birgit Pauli-Haack：是的，是的，太棒了。这是 23.2。还有一个名为 WordPress Theme 的 WordPress 组件，实际上是用于管理后台的主题。我们这里确实存在一些概念混淆，因为我们用同一个术语指代了好几种截然不同的东西，而它们彼此毫无关系，只不过现在它们都是 WordPress Theme 组件中用于持续时间和缓动的动效设计令牌。所以，如果你想在自己的管理页面和插件中使用这些令牌，尽管去用。我真的……因为这多少能让你以一种更具互动性的方式来构建网站，我觉得我们确实喜欢这些，或者至少我是喜欢的。是的，尽管我并不是那种偏爱动效或动画的人。不过，是的，当它足够优美时，我会喜欢。

Isabel Brison：是的。这里一点那里一点低调而流畅的动画，确实能大幅提升网页体验。

Birgit Pauli-Haack：是的，这算是某种提升生活质量的东西。对，对。23 里还有什么呢？对了，内容类型。它是在此前基础上的一次迭代。我们讨论过内容类型实验中的各种改进，以及文章类型和分类法管理、重复视图、快速编辑操作。已经有大量 PR 合并到其中，所以它确实在不断成熟。通过 23.2，媒体编辑器模态框也得到了完善，现在已经有。好了，我还会在节目说明中分享一个链接，指向 Dashboard 实验的概览议题，方便大家回头阅读，了解它到底是做什么的，因为这方面仍有大量工作正在进行。 

实验

还有一个关于经典区块迁移提示的实验。我特意提出来，是因为你可能会看到经典区块被弃用，或者在某些情况下无法使用。

Isabel Brison：是的。据我理解，计划是在某个时候弃用并移除它，但这是一个完整的过程，因为我想很多人都在使用它。所以这个过程需要缓慢推进，给大家时间适应并选择替代方案。

Birgit Pauli-Haack：是的，它在 Gutenberg 中已经存在了八年之类的时间，而且实际上我发现，有些 AI 工具生成的区块其实需要……它们看起来像经典区块，需要先迁移成区块，才能放进区块编辑器画布中。所以，是的，这类事情也需要在那方面进行一些测试。

Isabel Brison: 是的，说得很有道理。随着 AI，以及越来越多的 AI 工具被用于构建网站、创建内容，或将内容从其他地方迁移过来。你不希望 AI 往它的知识库里加入经典的区块，然后突然认定完成任何事情的最简单方式就是把全部内容都塞进一个经典区块，

Birgit Pauli-Haack:也就是他们现在正在做的事。对。

Isabel Brison:所以现在正是弃用它的时候，这样。好，让我们确保 AI 能正常运行，让 AI 工具更容易按我们的预期正常运作并完成相关工作。

文档

Birgit Pauli-Haack:它还没有合并，但也存在一个文档问题。这是一项庞大的工作，由 Juan Margarito 承担。原因是人们发现，AI 实际上无法找到每个核心区块的区块标记文档。这是一个文档缺口：人们发现区块库中的所有区块都没有 readme，因此它无法……所以 Guan Ma 做了什么呢？他根据区块 JSON 文件，自动在文档网站上为每个区块创建了一份 readme，然后创建了一些标记，让开发者可以在 readme 中添加额外的手动内容，再由解析器读取这些内容并将其放入区块编辑器手册中。这真是一项……里面会介绍所支持的样式、全局样式设计工具对区块标记的支持，以及区块与其他区块之间的关联。这是一份关于每个区块的全面文档，都收录在区块手册中。它将被合并。我们曾就此举行过一次线下聚会。我们还在 MakeBlog 上提出过相关提案，把它作为一个核心区块。我觉得它终于就要合并了——希望是在一周内，也可能只需几天。

Isabel Brison:哦，不错。

Birgit Pauli-Haack: 那会非常有用。所以它会被收录进区块编辑器手册。当然，它还额外增加了 80 页。对。但这些内容彼此关联，并按区块分类。现在，区块开发者可以从这里获得所需信息。社区里还有一些评论，有人说：“真希望我刚开始学习区块开发时就有这个。”现在它终于要来了。但这是一项巨大的工程，因为它需要创建大量新代码，而且所有这些代码都需要审查。参与其中的人非常多。整个过程由 Guan Ma 指导或牵头，如今终于即将完成，真的很棒。我很高兴它能够落地。

Isabel Brison:我的意思是，文档永远不嫌多，但开发者不擅长写文档。所以，你知道，如今我们有了辅助创建文档的工具，应该好好利用它们。

Birgit Pauli-Haack:对。混合版本——自动生成文档，同时提供加入手动内容的方式——实际上是一种很好的组合。因为对于某些区块，来自无障碍团队的 Joe Dawson 说过：“好吧，也许我们还想提供一些关于区块无障碍特性的文档。”任何对此有意见的人都可以把它添加到特定区块的 readme 文件中，以进一步说明相关内容。这完全不需要任何自动化操作。你可以直接把它添加到页面中。看到这个流程真正运转起来真的很酷。顺便说一句，我会在节目说明中放一个提案链接。 

Gutenberg 23.3

现在我们来到了 23.3。这个版本刚于 6 月 3 日发布，包含 270 个已合并的 PR 和 57 位贡献者。所以我们正在推进 7.1 之类的版本。其中第一项非常酷：现在你可以——我认为 Adam Silverstein 也参与了——对注释部分进行改进。

Isabel Brison: 哦，对，每个区块可以有多条注释。嗯，这很酷，也非常有用。

Birgit Pauli-Haack: 对，这样你可以在每个区块中设置多个评论串或评论。当 AI 进来审查你的文章并在其中添加注释时，这也会很有帮助。是的，这真的很有帮助。而且他发现这个功能是必需的。所以，与 Google Docs 相比，注释功能还缺少的是：你可以选中一段内容，然后对该部分发表评论。比如“好吧，你大概可以删掉这半句话之类的”。而在此之前你无法做到。现在，通过为区块设置多个评论串，你可以选中一段内容，因为如果一个段落有——我不知道——10 行之类的内容，你可能会在这个区块上有多条评论。现在你可以这样做了。所以真的很酷。

Isabel Brison: 对。所以注释不是附加在区块本身，而是附加在区块的某一部分上。

Birgit Pauli-Haack: 对，对。接下来的几个部分将继续帮助你完成响应式样式方面的工作。

增强功能

Isabel Brison: 对，这是相关工作的第二部分，也就是为区块实例启用响应式样式。所以这同样是工作的一部分。Maggie Cabrera 之前做过全局样式的伪类状态，并且有一个开放的 PR，计划将这些状态添加到区块实例中。Dan 和我在她同意的前提下，基本“劫持”了她的 PR。我们先询问 Maggie，看看能否接手她正在做的这项工作。她当时在忙别的事情，没有 actively 在处理这个 PR。我们想，我们可以直接接手并完成它，然后在它的基础上构建响应式样式。于是我们这么做了。显然，之前已经有一些工作，所以这样一步一步在其基础上构建会更容易。现在，在 23.3 中，我们能够为任何区块添加响应式样式。打开一篇文章，选中一个区块，打开检查器控件，然后在顶部显示区块名称的位置，有一个小菜单，其中包含一个下拉菜单，列出了各种状态。 

所以，和全局样式一样，我们也有平板端和移动端。默认设置就是默认情况下获得的效果，也就是你之前已有的设置。然后还有平板端断点和移动端断点。和全局样式一样，其中有一些控件开箱即用时无法正常工作。所以我们决定把无法正常工作的内容全部隐藏起来。因此，目前启用的只有那些你实际上可以用来创建响应式样式的控件。它们基本上涵盖所有区块支持项，例如颜色、排版、尺寸、区块间距。现在也支持布局，而这带来一个副作用：我们最终把布局面板移到了“样式”标签页中。这其实——我得说，我一直都想这么做，因为在我看来，把“布局”放在“设置”标签页，同时把“尺寸”放在“样式”标签页实在毫无道理；而“尺寸”里还有区块间距等与布局密切相关的控件。所以我觉得，唯一切合理的做法就是让二者相邻。如果不是同一个面板的话——我仍然认为我们或许可以把它们做成同一个面板——那又是另一场讨论了。但至少现在它们相邻。因此，现在布局位于样式面板中。这就是它被放在样式面板中的原因。所以，当启用响应式状态时，我们在检查器中只显示样式面板，并且只显示可正常工作的控件，其中大多数都可以使用。不过还是有几项内容不得不再次隐藏，比如“do”和“two”之类的。 

对于区块实例，有些区块带有自定义控件，其中一些自定义控件或许应该成为区块支持项。有些控件本身已经是区块支持项，比如宽高比，但只有一个区块在使用它，而且还有几个区块采用了各自自定义的宽高比实现。这一点应该改变。我已经提交了一个开放 PR，试图让宽高比支持响应式功能，因为我觉得这是人们会希望针对不同断点调整宽高比的重要功能之一。所以这项工作正在进行中。我们的计划基本上是尽可能让更多功能正常运行，直到 7.1 版本发布。

Birgit Pauli-Haack：太棒了。所以，当我想要开始测试这个功能时，我会先在区块画布中添加一个段落，然后进入区块检查器并选择：好的，我要为这个段落针对不同视口设置不同的背景。移动端设为绿色，平板端设为黄色，桌面端设为灰色。

Isabel Brison：没错，你可以这么做。

Birgit Pauli-Haack：好的。是的，我会这样修改。

Isabel Brison：你可以进入设置，给出默认值。桌面端是默认选项。我想我们并不是移动端优先的。实际上，Gutenberg 从一开始就一直是开发桌面端优先的体验。结果也一直是这样。所以默认是桌面端，然后你可以切换到平板状态，选择平板状态后，你在区块检查器中添加到该状态可见控件里的内容都仅适用于该状态。你还可以进入移动端，为其选择不同的颜色并保存所有设置，然后就可以使用过去那种熟悉的窗口调整方式了。在区块编辑器中，我们利用响应式预览，也就是特定设备的预览，让你在编辑样式时看到相应的预览效果。进入前端后，你可以随意调整窗口大小，看到所有变化实时呈现。

Birgit Pauli-Haack：好的，好啊。这真的很酷，我很期待实际测试和体验一下，然后发表一些看法。

Isabel Brison：对，对，没错，肯定会有很多看法。我感觉我们还没有把预览功能做到 100% 完善。比如，你启用某个区块的移动端状态后，它会切换到移动端预览；但你仍可以在移动端预览中选择另一个区块，而此时该区块并不处于移动端状态。所以我觉得这是我们正在改进的事情。我们需要优化这个体验和反馈机制。再次欢迎大家分享意见。你对这一点有什么看法，以及你认为怎样使用起来最直观？

Birgit Pauli-Haack：太棒了。是的，我在想也许我们真的应该找个地方做一次相关主题的演示活动。让我想想。我有个时间问题，因为我要去度假了。

Isabel Brison：好的。对。

Birgit Pauli-Haack：我七月初回来，不过肯定没问题。也许可以找人录制一段演示视频之类的。所有演示都在 PR 里，所以一定要去看看，因为这是了解如何使用它、哪些功能有效或无效的最佳方式。好的。还有什么？23.3 里还有别的内容吗？

Isabel Brison：内容非常多。媒体编辑器已经稳定下来，因此不再是实验性功能。无论你是否愿意，现在默认都会使用它。我的意思是，我们希望收到这方面的反馈。老实说，我认为这是一项相当不错的工作。

Birgit Pauli-Haack：是啊，确实如此。完全同意。我只是想再提一下——你之前说过，也谈到过。但如果你安装 23.3 版本的 Gutenberg 插件后正在寻找布局面板，它没有被隐藏，也没有丢失。现在它位于“样式”选项卡中。

Isabel Brison：是的。

Birgit Pauli-Haack：有些内容创作者对此不感兴趣，可能会疑惑：“咦，它去哪儿了？”它现在在另一个选项卡里。对。

Isabel Brison：就是这样。对于仍有“设置”面板的区块来说，这可能会显得有些奇怪。那么，对于区块，分组区块发生了什么变化？例如，分组区块的“设置”中原本只有布局和位置，因此我们把位置移到了“样式”中。因为这样更合理。位置是一种样式。现在分组区块不再有“设置”选项卡。因此，你只需打开分组。我认为这样方便得多，因为你不必反复点击。所有内容都在那里，一目了然。对于其他区块，布局、位置和所有其他控件也都位于同一个选项卡中。例如，导航区块的“设置”中仍然有很多内容。所以，如果你在页面上放置了一个导航区块，然后突然发现布局控件不见了？好吧，它们现在位于“样式”选项卡中，已经不在“设置”选项卡里了。

Birgit Pauli-Haack：我只是想指出这一点。人们有些时候会忽略这部分，因为他们对响应式能力感到非常兴奋。 

另外还有一件事。哦，有一项内容得到了修复。它原本是一个错误，但可以说是一项增强功能：对于“附加 CSS”，如果其中存在错误，当你再次进入文章时并不会看到错误消息，除非你与“附加 CSS”字段进行交互，否则你不会看到错误消息。因此，除非你进行交互，否则你不会知道它实际上无法正常工作。现在这一点已经改变了。现在会有一个小通知，提示“附加 CSS”中存在无效的 CSS，供那些会摆弄这项功能的人参考。是的，在这里。PR78653 将模态媒体编辑器和图片裁剪器模态框设为区块编辑器的默认体验。它已经退出实验状态。23.3 的另一项变化是 Gutenberg 升级到了 React 19。这对于插件开发者以及那些对工作依赖关系掌控得非常严格的人来说很重要。React 19 现在是默认版本，而且可能还有潜藏的问题。请、请、一定要提供反馈。创建工单，说明哪些功能可以正常工作，哪些不能。尤其是哪些不能正常工作。这样就能修复 PR 7.1，避免你以后遇到意外。还有什么？我想那些就是主要项目。

Isabel Brison：是的，我的意思是，过去几周我一直埋头于响应式样式这项工作。非常、非常专注于把这件事做好。

Birgit Pauli-Haack：所以我完全无话可说。

Isabel Brison：我的意思是，它确实得到了大量关注。是的。还有什么？

Birgit Pauli-Haack：绝对是上帝的杰作。

Isabel Brison：希望它值得。

Birgit Pauli-Haack：是的，绝对如此。是的，绝对如此。是的，我想就是这些。正如我所说，一共有 270 个 PR。所以，是的。它已经发布一段时间了。

Isabel Brison：这里面有很多增强功能、错误修复之类的东西。

Birgit Pauli-Haack：是的，就是这样。我认为我们准备得差不多了。因此，亲爱的听众们，你们会看到，在我的假期期间，“周末版”和 Gutenberg 更新日志将暂停。我下周，也就是 6 月 15 日开始休假，并将在 7 月初回来。届时正好赶上 7.1 beta，你们又会听到我们的声音，也会再次看到我们的内容。 

Isabel，我太高兴了，你来参加节目，带我们了解 Gutenberg to 7.1 带来的所有精彩功能，尤其是响应式部分。响应式部分。我喜欢这个说法。响应式部分。非常感谢你从繁忙的工作日程中抽出时间参加节目，带我们详细了解这些功能。

Isabel Brison: 不用客气。你总是很喜欢这个节目。

Birgit Pauli-Haack: 非常感谢。正如以往一样亲爱的听众，节目说明将发布在 GutenbergTimes.com 的播客中。这是第 1311 期，31st。如果你有问题、建议或希望我们报道的新闻，请发送至 changelogutenbergtimecs.com，也就是 changelogutenbergtimes.com。 

感谢大家收听。下次再见，我们七月见。 

Isabel Brison: 再见。