從WordPress 5.8開(kāi)始，一個(gè)新工具——“theme.json”——可用于您的主題。也許您是第一次聽(tīng)說(shuō)它，或者您已經(jīng)在用它測(cè)試和開(kāi)發(fā)主題。無(wú)論哪種方式，我都很高興您來(lái)到這里，因?yàn)閷?duì)于 WordPress 主題來(lái)說(shuō)，這是一個(gè)激動(dòng)人心的時(shí)刻。
這篇文章簡(jiǎn)要介紹了這個(gè)新框架，并通過(guò)分享一些實(shí)用的技巧和示例來(lái)描述可能的情況。
什么是theme.json？
從技術(shù)上講，theme.json 只是一個(gè)位于主題目錄頂層的文件。
從概念上講，這是主題開(kāi)發(fā)方式的重大轉(zhuǎn)變。主題作者現(xiàn)在有一個(gè)集中的機(jī)制來(lái)為網(wǎng)站作者和訪問(wèn)者定制 WordPress 體驗(yàn)。Theme.json 為主題作者提供對(duì)全局樣式、塊樣式和塊編輯器設(shè)置的精細(xì)控制。
通過(guò)在單個(gè)文件中提供這些設(shè)置和控件，theme.json 提供了一個(gè)強(qiáng)大的框架，將主題設(shè)計(jì)和開(kāi)發(fā)的許多方面結(jié)合在一起。而作為塊編輯器日趨成熟，并增加了更多的功能，theme.json會(huì)成為主題和編輯器定制的支柱?。?
為什么使用它？
這是未來(lái)！但如果你像我一樣，你可能需要更具體的東西才能被說(shuō)服。以下是您今天可能使用 theme.json 的幾個(gè)原因：
- 控制顏色、排版、間距和布局等編輯器設(shè)置，并整合管理這些設(shè)置的位置。
- 保證樣式正確應(yīng)用于整個(gè)站點(diǎn)的塊和元素。
- 減少主題用于提供的樣板 CSS 的數(shù)量。Theme.json 不會(huì)完全替換您的樣式表——在某些情況下，需要 CSS 來(lái)為您的主題提供額外的支持（過(guò)渡、動(dòng)畫等）。但它可以大大減少主題所需的基本 CSS。
我如何使用它？
本文演示了一些您可以嘗試的 theme.json 配置。這些示例使用 tt1-blocks?theme.json?—今年默認(rèn)主題的基于塊的版本。?
如果你開(kāi)始與現(xiàn)有的主題，你可以嘗試從WordPress的/主題的實(shí)驗(yàn)資料庫(kù)（例如，在FSE-教程主題）復(fù)制theme.json?，并將其添加到你的主題目錄的根目錄。
全局更改站點(diǎn)的排版設(shè)置
"settings": {
"typography": {
"fontSize": "30px",
...在 theme.json 中進(jìn)行上述更改將導(dǎo)致主題的正文排版樣式的前后對(duì)比：
全局更改站點(diǎn)的基色設(shè)置
"styles": {
"color": {
"background": "#ffc0cb",
"text": "#6A1515"
},
...
}
更改特定塊的外間距/內(nèi)間距設(shè)置
"styles": {
"blocks": {
"core/code": {
"spacing": {
"padding": {
"top": "3em",
"bottom": "3em",
"left": "3em",
"right": "3em"
}
}
}
}
}
在編輯器中為按鈕等特定塊設(shè)置自定義調(diào)色板
"settings": {
"blocks": {
"core/button": {
"color": {
"palette": [
{
"name": "Maroon",
"color": "#6A1515",
"slug": "maroon"
},
{
"name": "Strawberry Ice Cream",
"color": "#FFC0CB",
"slug": "strawberry-ice-cream"
}
]
}
}
}
}
啟用和禁用排版控件
在以下示例中，禁用為所有標(biāo)題塊提供自定義字體大小和行高的功能：
"settings": {
"blocks": {
"core/heading": {
"typography": {
"customFontSize": false,
"customLineHeight": false
}
}
}
}
下一步是什么？
我希望這能讓您了解什么是可能的以及主題的發(fā)展方向。上面的例子只是觸及了什么樣的主題設(shè)計(jì)配置是可能的表面，我很高興看到主題作者創(chuàng)造了什么。
如果您有興趣了解更多信息，請(qǐng)參閱關(guān)于 theme.json 的開(kāi)發(fā)人員說(shuō)明，以及手冊(cè)中關(guān)于 theme.json 的文檔。
注：本文內(nèi)容出自 wordpress.org，由 WordPress大學(xué) 翻譯整理。
