欢迎来到本课,我们将探讨在经典主题中添加 theme.json 文件这一选项。
通过本课,你将能够:
- 列出在经典主题中添加 theme.json 的好处,以及
- 描述在经典主题中添加 theme.json 的过程。
在经典主题中添加 theme.json 有哪些好处?
这里我们以 Twenty Twenty-One 作为当前激活的主题。我们将通过打开一个页面来查看终端用户可用的部分设置和样式。我们来打开示例页面。
如果我们选择一个区块,然后转到右侧这里,我们会看到文本和排版设置及样式可用。通过 theme.json,我们可以控制这些设置和样式。
例如,你可以选择禁用标题区块的颜色支持。这里你看到的是为了禁用标题区块的颜色支持而添加到 theme.json 中的代码。
{
"version": 2,
"settings": {
"blocks": {
"core/heading": {
"color": {
"background": false,
"text": false
}
}
}
}
}
添加 theme.json
现在让我们来看看如何将 theme.json 添加到经典主题中。我们将 theme.json 添加到 Twenty Twenty-One 主题中。我们只需要 schema 和版本号即可开始。
{
"$schema": "https://schemas.wp.org/trunk/theme.json",
"version": 2
}
要了解更多关于将 theme.json 添加到主题的信息,请查看《初学者 WordPress 开发者学习路径》中的《全局设置和样式》课程。
如果我们现在回到 WordPress 并重新加载页面,我们会看到布局发生了变化。这是因为 WordPress 自带的 theme.json 现在被激活了。
要解决这个问题,请回到 theme.json 并添加内容尺寸的设置。
添加 650px 并保存这些更改,然后回到 WordPress 并再次重新加载。
{
"$schema": "https://schemas.wp.org/trunk/theme.json",
"version": 2,
"settings": {
"layout": {
"contentSize": "650px"
}
}
}
如果你想查看 WordPress 核心中 theme.json 的所有设置,可以在 ‘wp-includes/theme.json’ 文件夹中找到它。
后续步骤
如果你想了解更多关于 theme.json 的信息,可以查看 WordPress.org 上提供的区块编辑器手册。