社区新闻

开发者新动态(2023年5月)

欢迎回来,WordPress扩展者们。又到了最新的月度综述时间,涵盖了您在WordPress之上构建插件和主题所需了解的一切。

对于2023年5月版,有很多令人兴奋的内容。在测试本文提到的功能时,请务必使用最新版本的WordPress trunk和至少Gutenberg 15.7。

重点内容

区块选择器API

选择器API已在Gutenberg 15.5中稳定,并将在WordPress 6.3中可用。它允许您自定义生成区块样式时使用的CSS选择器。这一变化意味着更少的变通方法和对区块更精细的控制。

您现在可以通过设置selectors对象在block.json中定义区块的选择器。默认情况下,root选择器是区块的生成类。您可以定位根、特定功能(例如color),甚至子功能(例如typography > text-decoration)。以下是一个使用选择器API的block.json示例:

{
	"selectors": {
		"root": ".your-block-selector",
		"color": ".your-block-selector > div",
		"typography": {
			"root": ".your-block-selector h2",
			"text-decoration": ".your-block-selector h2 span"
		}
	}
}

定义自定义选择器允许WordPress自动为区块生成适当的CSS,如下所示:

.your-block-selector > div {
	color: var( --wp--preset--color--contrast );
	background: var( --wp--preset--color--base );
}

.your-block-selector h2 {
	font-family: var( --wp--preset--font-family--primary );
}

.your-block-selector h2 span {
	text-decoration: underline;
}

但这只是该API功能的冰山一角,它应该能极大地简化您构建复杂区块的方式。有关完整概述,请访问区块编辑器手册中的选择器API文档

首个社区主题在目录中上线

社区主题项目于2023年3月10日启动,超过20名主题社区成员参加了启动会议。会议的目的是评估在官方WordPress.org旗帜下创建基于区块的主题的兴趣,类似于核心附带的默认主题。

设计师、开发者和社区成员已联合起来推动项目前进。Stacks,一个用于创建幻灯片的主题,是该项目的第一个成果,现已在WordPress主题目录上线。

显示了两张垂直幻灯片,其中一张向上滚动以替换其上方的幻灯片。

无论您的经验水平如何,都可以参与该项目。开始所需的一切信息都可在社区主题GitHub仓库中找到。

实验性Details区块

Gutenberg 15.6引入了一个实验性的Details区块,您可以用它来显示摘要并隐藏额外内容。您也可以选择默认显示内容。

Details和Summary元素在区块编辑器中显示为可编辑区块。

此区块有一个替代版本,预计将登陆Gutenberg 15.8。现在是开始测试的时候了,但要计划其当前的标记和功能可能会发生变化。

插件和工具

为Group和Media & Text定义允许的内部区块

allowedBlocks属性的支持现在允许您限制GroupMedia & Text区块的内部区块。通过此更改,您可以通过自定义实现或模式进一步为用户策划编辑体验。

自定义wp-env run的工作目录

默认情况下,wp-env run命令中使用的任何相对路径都是相对于/var/www/html目录的。Gutenberg 15.7中的一个补丁添加了一个--env-cwd选项,允许您更改工作目录

HTML API的自闭合标志检查

WordPress 6.3将提供WP_HTML_Tag_Processor:has_self_closing_flag()方法,用于确定HTML标签是否存在自闭合标志。您不能用它来确定标签本身是否是自闭合的,只能确定标志是否存在于标签的语法中。主要用例是处理HTML外来元素。

错误修复

WordPress 6.2中的一个错误导致通过attachment_fields_to_edit钩子添加的自定义字段在用户上传图片时无法渲染。此问题现已修复并将回溯到WordPress 6.2.1。

文档更新

区块编辑器手册有一个新的改进的首页,应该能帮助您更好地浏览其内容。贡献者还更新了手册中的几个文档页面,旨在改善编写区块的学习体验

主题

主题目录的样式变体过滤器

您现在可以开始在区块主题的style.css文件头中使用style-variations标签。主题目录最近将其添加为过滤器,供搜索主题的用户使用。在撰写本文时,还没有任何主题带有此标签——您可能是第一个!当然,您的主题需要实际捆绑至少一个自定义样式变体才能使用它。

从站点编辑器创建首页模板

Gutenberg 15.7将首页添加到了可以直接从站点编辑器创建的模板列表中。这一变化使您更轻松地在WordPress管理后台舒适地构建主题。

区块设计工具的添加和更新

您现在可以为Cover区块添加边框。这主要是一个增强功能,但您应该检查CSS中添加的overflow: hidden是否会影响该区块的任何自定义。该规则在后续的拉取请求中被移除,然后又被恢复

其他几个区块改进了对各种设计工具的支持:

  • Embed添加了对margin的支持
  • Columns和Column添加了对blockGap的支持(在UI中显示为区块间距
  • Spacer现在使主题定义的间距预设可作为选项使用
  • Time to Read允许您定义背景和文本颜色

改进的最小字体大小计算

Gutenberg 15.7中的一个实验性补丁引入了对数刻度,用于计算流体排版功能的最小字体大小。该刻度随着字体大小的增加而逐渐减小。您应该测试您的主题设计,以确保此更新不会对其排版产生负面影响。

导航回退功能整合

直到Gutenberg 15.7,处理创建和检索回退导航菜单的逻辑一直存在问题。该逻辑容易出错,并且代码在JavaScript和PHP中重复。一个最近的补丁将逻辑集中到单一实现中。更新到Gutenberg 15.7后,请检查您的菜单以确保它们正常工作。

错误修复

Shortcode区块UI现在有了更具体的样式规则,这应该可以防止您的主题CSS无意中覆盖编辑组件。

WordPress 6.2向comment_time()函数添加了一个$comment_id参数,但它没有正确传递给get_comment_time()。此问题的修复将登陆WordPress 6.2.1。

文档

全局设置和样式操作指南中现在有一个新的变体部分,解释了如何在theme.json中为区块样式变体添加自定义样式。

theme.json动态参考现在还记录了customTemplatestemplatePartspatterns设置。

值得注意的以用户为中心的更改

站点Logo区块现在有了改进的流程,允许您设置、替换和重置徽标。这使该核心功能的区块版本与经典主题所能实现的功能持平。

模板模式建议模态的网格设计被替换为瀑布流布局。您应该根据此更改测试您注册的模板模式,并在工单上留下反馈,如果有任何问题。

活动和资源

开发者时间

交互API于2023年3月提出。该项目的目标是为构建交互式区块创造更好的开发者体验。在过去的一个月里,举行了两次开发者时间会议以覆盖多个时区。您可以在WordPress.tv上观看:

Learn WordPress

过去一个月,Learn WordPress网站上新增了三个资源:

开发者博客文章

过去一个月发表了三篇新文章: