Gutenberg 21.7.0 最新更新:编辑体验全面升级

Gutenberg 21.7 已在 9 月24日正式发布,为 WordPress 编辑器带来了全方位的升级。这一版本重点优化了 命令面板与数据视图,增强了 DataForm 控件 的验证与交互体验,并扩展了 全局样式,让表单元素与整体设计更加统一。与此同时,大量 bug 得到修复,性能与无障碍功能进一步提升。在底层,编辑器继续推进 TypeScript 迁移,为未来平滑过渡到 React 19 打下基础。无论是内容创作者还是开发者,都能在 Gutenberg 21.7 中体验到更顺畅、更高效、更稳定的工作流程。

一、命令面板与全局操作更便捷

在新版中,命令面板的功能进一步增强:

自定义 CSS 命令 已经移至核心命令包中,编辑站点时能更快调用。

菜单导航注册 基于 Core Menu API 实现,开发者可以用更统一的方式来管理站点菜单。

所有屏幕都支持 导航命令,无论是编辑页面还是配置界面,都能直接调用命令操作。

这意味着站点管理将更加直观,编辑流程不再受限于单一界面。

二、数据视图与 DataForm 全面升级

数据视图(DataViews)在这一版本有了大幅改进,重点包括:

支持 颜色字段、数据选择器、密码字段,让数据管理更直观。

DataForm 控件增强:单选、下拉、多选组都支持验证与描述,更适合电商和表单场景。

新增 URL 和电话字段,并在邮件和电话控件中加入图标,界面更友好。

布尔值字段 从切换 UI 改为复选框 UI,更符合操作直觉。

日期时间控件 采用日历式选择,减少输入错误。

引入 groupBy 列表布局行布局,更适合复杂数据展示。

对用户来说,表单和数据展示的可控性显著提升;对开发者来说,扩展性和可维护性也更强。

三、块库与写作模式优化

块库新增与调整亮点:

导航链接 的“添加页面”按钮改为“创建页面”,并在写作模式下直接显示,减少层级切换。

目录块工具栏 更新,更方便快速排版。

条款查询块 新增,Order 和 Order By 控件合并,操作更简洁。

手风琴块 支持 BlockGap,用户可轻松调整内容间距。

在写作模式中,还增加了导航添加页面按钮,并允许隐藏 Query 子项的发布日期,减少干扰。这些改动让写作体验更贴近真实需求。

四、块绑定与编辑器改进

新版对块绑定和编辑器也有多项优化:

新增 block_bindings_supported_attributes 过滤器,为更多属性绑定提供支持。

图像块在 caption 属性绑定时,可以保存 <figcaption> 内容,提升内容一致性。

插入器在空块场景下的显示逻辑更合理,避免无谓的干扰。

同时,编辑器对标签和本地化进行了优化,保证多语言站点的使用体验。

五、全局样式与性能优化

全局样式覆盖范围扩大:站点编辑器始终显示“附加 CSS”按钮,表单元素也全面纳入全局样式控制。

BorderRadius 预设修复:避免生成错误变量名,提高主题兼容性。

Core Web Vitals 优化:通过减少冗余代码和动画,提高加载性能。

对站长来说,统一的全局样式意味着风格更一致,也更容易维护。

六、错误修复与无障碍改进

这次更新修复了许多影响体验的问题:

修复了弹出滚动钩子的滚动异常。

优化了表单控件的颜色变量处理。

修复了过时插入点引用问题,编辑器更稳定。

在无障碍改进方面:

“n 个更多回复”文本可点击,提升评论区可访问性。

评论字段支持 TextareaAutosize,输入体验更好。

支持在已发布文章中启用内嵌评论,并新增重新打开已解决评论的功能。

这些改进让 Gutenberg 更加贴合真实的内容协作场景。

七、开发者与底层增强

引入新的 useCommands API,开发者可以用更现代的方式调用命令。

大量模块迁移到 TypeScript,为未来升级到 React 19 做好准备。

精简不必要的 JS 文件,减少加载压力。

测试方面,新增自动化测试与端到端测试,保证新功能的稳定性。

这为 WordPress 的长远发展打下坚实的技术基础。

八、总结

这次 Gutenberg 更新不只是小修小补,而是一次全方位的体验优化。让编辑者有更顺畅的写作和布局体验、开发者有更强大的 API 与 TypeScript 支持、用户有更快的加载速度与更高的交互可用性,使得大家都能从中受益。

这次更新让 Gutenberg 更加成熟,WordPress 编辑器正迈向一个高效、稳定、面向未来的阶段。

Leave a Reply

您的电子邮箱地址不会被公开。 必填项已用 * 标注