Gutenberg 12.1 修復了 Block Appender 佈局移位，添加了模板列表視圖，並增強了全局樣式

已發表: 2021-12-09

今天早些時候，Gutenberg 12.1 登陸了 WordPress 插件目錄。最新版本對用戶體驗進行了重大改進，包括對塊追加器佈局轉換的修復、新的全局樣式功能和改進的模板列表視圖。主題作者還有一個新標誌，用於啟用所有與外觀相關的工具。

WordPress 5.9 原定於今天發布，但已被推遲到 2022 年 1 月 25 日。貢獻者需要更多時間來完善與發布捆綁在一起的站點編輯器和相關工具。到目前為止，他們通過修復錯誤和創造整體更好的用戶體驗來利用額外的時間。

不再有佈局轉變

如果這是 Gutenberg 12.1 中唯一的變化，我將成為世界上最快樂的用戶。幸運的是，還有其他不錯的項目，但我使用塊編輯器三年來最大的煩惱現在已經得到解決。

內容畫布中的塊附加程序（那些小的+按鈕）現在使用固定定位顯示。這意味著當您選擇塊時，尤其是那些嵌套在其他塊中的塊時，屏幕不再反彈、移動佈局或在原本完美的部分留下空白間隙。

我從與其他人的交談中了解到，這是過去構建複雜佈局時的一個痛點。對於某些人來說，他們根本不會使用塊編輯器，因為它太煩人了。如果你落入這個陣營，值得再試一次。這是用戶體驗的顯著改善。

用戶現在可以通過全局樣式側邊欄中的調色板部分定義自定義漸變。這些將在整個站點中可用，並且與主題無關。

調色板還在同一漸變部分下顯示雙色調顏色。但是，目前還沒有創建自定義雙色調濾鏡的選項。這是一個只讀部分。

全局樣式面板還將文本和鏈接元素之間的排版選項分開，為將來的其他 HTML 元素打開了大門。

用戶可能不應該為鏈接更改此設置。相反，它們通常應該與周圍的文本相匹配。如果我們將來獲得 text-decoration 或類似選項，分離可能更有意義。但是，更改字體大小或行高等設置可能對設計不利。

Gutenberg 12.1 引入了來自站點編輯器的新模板和模板部件列表視圖。在過去的幾個插件版本中，此功能的 UI 已經跳躍。該列表可通過編輯器中的左側滑出面板獲得數月之久。然後，它在 11.9 中被完全刪除。它在該版本和 12.0 之間重新出現。

該面板現已縮小，包括站點、模板和模板部件的三個鏈接。第一個鏈接調出站點編輯器。其他顯示現有模板的表格。

目前在屏幕之間切換感覺很慢。但是，這是 1.0 版本的站點編輯器，全世界的 WordPress 用戶都會看到。它可能會隨著時間而改變。 “當前的設計迭代有利於簡單性和可用性，”Riad Benguella 在公告中寫道。 “將來可能會添加實現客戶端導航和馬賽克視圖的迭代。”

似乎沒有辦法添加自定義模板，例如類別或作者檔案。使用二十二十二主題時，單擊“添加新”按鈕會顯示首頁和搜索模板的選項。

但是，添加新的模板部件是一個更加精細的過程。單擊按鈕創建一個後，用戶會看到一個覆蓋和表單，如下面的屏幕截圖所示：

用戶可以給它一個自定義名稱，並在三個允許的區域之間進行選擇：常規、頁眉和頁腳。創建新零件後，用戶將被帶到編輯器。

再次查看模板部件列表時，它會顯示創建它的用戶並有一個選項下拉列表（省略號按鈕）。目前，唯一的操作是刪除該部分。

我希望看到頂級模板在創建新模板時得到與模板部分相同的處理。儘管它們之間存在一些細微差別，但歸根結底，兩者都是模板。如果創建過程匹配，用戶體驗將受益。

在此屏幕的默認列表之外創建自定義模板也將幫助設計人員從站點編輯器直觀地構建主題。

最新版本引入了空導航菜單塊的後備。最終，如果沒有找到菜單，它將顯示頁面列表塊。根據用戶網站的頁面數量，這可能很快就會失控，如下面的二十二十二截圖所示：

主題開發人員可以通過block_core_navigation_render_fallback過濾器鉤子覆蓋此後備，方法是返回一個false值或一組有效的導航父級子塊。主題作者，我邀請他們慷慨地使用這個過濾器鉤子。

對於塊主題開發人員，標準模板相關文件夾已重命名。舊名稱將繼續有效，但作者應在其主題中更新以下內容：

此更改清理了頂級主題目錄，但它也為未來的更多標準化開闢了道路。 /patterns已經有一張開放票，並且/styles文件夾是可能的。

Gutenberg 12.1 還為theme.json引入了appearanceTools工具標誌，允許主題作者啟用對所有當前和未來邊框、顏色、間距和排版選項的支持。我在 Gutenberg 12.0 帖子中更詳細地介紹了這一點，該帖子錯誤地將該功能標記為與上一個版本捆綁在一起。