Gutenberg 11.5 添加了小部件分組、迭代塊間隙功能並更新了導航菜單

已發表: 2021-09-17

古騰堡 11.5 今天早些時候登陸。 這是一個重要的版本,包括對導航塊的廣泛更改、對小部件進行分組的新方法以及更多塊間隙功能集成。

我對使其成為最新版本的功能反應不一。 在某些時候,我心想,終於,這成功了。 在其他時候,我渲染了讓-呂克·皮卡德著名的臉型的最佳版本。 但是,車輪一直在轉動,將時間和精力投入到項目中的開發人員繼續改進它。

一個快速說明是,每個不運行支持塊編輯器的主題的人都應該檢查他們的後端樣式是否不合適。 如果用戶的活動主題沒有註冊自己的主題或存在theme.json文件,Gutenberg 會自動輸出一些默認的編輯器樣式。 這應該捆綁在 WordPress 5.8.2 等點發布版本中,這樣用戶就不會等到 5.9 版本。

導航塊更改

由於導航菜單仍然是網站編輯的痛點,古騰堡增加了新的複雜程度。 站點標題和站點徽標塊允許在導航容器內。

正如 Joen Asmussen 在原始票中所分享的,一些複雜的佈局將受益於在 Navigation 塊中允許更多內部元素:

這可以通過自定義模式為主題作者打開一個佈局可能性的世界。

我對 Gutenberg 解決這些更高級佈局的基礎沒有意見。 但是,我們還沒有理順導航的基礎知識。 搜索和插入站內鏈接的體驗充其量是平淡無奇的,需要多次點擊鼠標。 有一個更輕鬆的導航體驗的開放票,這應該是重點。

主題作者還應該注意,導航塊現在依賴於 CSS gap屬性來表示間距而不是margin 。 我幾乎錯過了這一點,因為幾個月前我為自己的項目定制了這個——歡迎來到 2021 年,我們不再需要依靠 hacky 的邊距解決方案來實現簡單的間距。 此更改可能會影響現有的主題設計。

FSE 管理員通知僅限於主題屏幕

主題/外觀管理屏幕上的 FSE 主題管理通知。
唯一的 FSE 主題管理員通知。

Gutenberg 插件有很多抱怨,因為它的功能不斷變化。 然而,運行插件最煩人的事情是當用戶運行塊主題時它的持久性、不可關閉的管理員通知。

在該插件的先前版本中,此通知已出現在後端的每個屏幕上。 現在,它只出現在主題/外觀頁面上。

在過去的幾個月裡,我一直保持 Ben Gillbanks 的 Toolbelt 插件處於活動狀態,其唯一目的是隱藏此通知。

甩掉包袱。 告別。

小部件組塊

WordPress 管理員中的小部件屏幕,其中顯示了新的小部件組塊。
編輯小部件組塊標題。

雖然我普遍認為 Gutenberg 插件開發人員和核心 WordPress 很好地利用了反饋,但基於塊的小部件系統一直是該項目失敗的一個領域。 正如我自 2020 年 9 月以來一直在重複的那樣,該功能從根本上被破壞了。 目標是允許最終用戶在更多地方添加塊,但它從未與經典主題標記和样式兼容。

我建議使用模式,但團隊使用了 Widget Group 塊。 最終結果相似但不完全相同。 好消息是它修復了本應阻止功能登陸核心的問題。

更好的消息是,這很可能會在今年晚些時候登陸 WordPress 5.8.2 而不是 5.9 版本。

我不會稱其為完美的解決方案。 經驗並未立即明確如何添加小部件標題。 用戶必須先添加一個塊。 添加塊後,他們可以單擊出現的標題/標題佔位符。 然後,UI 切換到用於輸入標題的字段。

以下視頻顯示了 Widget Group 塊的工作原理:

我寧願有一點笨拙的經歷,也不願根本沒有解決方案。 至少用戶現在不必手動創建小部件包裝器。 如果這個問題是一個問題,有些人甚至可以停用 Classic Widgets 插件。

“行”組變體和 Flex 佈局

使用新的行塊變體,帖子作者、日期和評論鏈接彼此相鄰排列。
添加帶有 Row 塊變體的帖子元(署名)部分。

為了開始測試 Gutenberg 11.2 中引入的新 flex 佈局系統,開發團隊在名為 Row 的 Group 塊上添加了一個變體。 這允許用戶並排對齊內部塊,而不是在默認的“流”佈局中彼此重疊。

該功能有大量用例。 主題作者的主要場景之一是將帖子和評論元數據塊彼此相鄰對齊。 以前,這需要使用 Columns 塊或自定義樣式,這兩種方式都不理想。

邊緣的體驗很粗糙。 我經常發現很難在正確的位置單擊來編輯塊,並且附加按鈕並不總是出現用於添加新的。

社交圖標塊也使用新的 flex 佈局。 但是,目前還沒有辦法將其切換為垂直社交鏈接的流模式。

更多塊間隙集成

突出顯示各個列塊之間的間距/間隙。
每個 Column 塊之間的間隙。

Columns 塊現在使用 Gutenberg 11.4 中引入的間隙功能來處理各個 Column 塊之間的間距。 目前還沒有供最終用戶控制的 UI,但隨著功能的發展,它很可能會在未來的版本中登陸。

Gutenberg 11.5 現在在編輯器中為帖子標題添加了底部邊距。 無論出於何種原因,開發團隊已經取得了飛躍,並假設其當前對塊間隙功能的處理需要這樣做。 這是一個需要解決的複雜問題。 與此同時,一些用戶可能會在編輯器的標題和內容之間看到比他們習慣的更多的空白。

塊編輯器中帖子標題和內容之間的空白數量異常。
那裡有很多額外的間距。

當然,這取決於活動主題、對塊間隙功能的支持以及當前樣式。

發表作者雙色調支持

對於本來應該被扔進垃圾堆的東西,Post Author 塊現在有了一些新的生命,它的頭像支持雙色調過濾器。 它與其他塊的工作方式相同,例如圖像和封面。

問題是 Post Author 已從上一個 WordPress 版本中刪除,因為它還沒有準備好。 該塊是作者姓名、頭像和描述的科學怪人混搭。 這些應該是主題作者和用戶可以以獨特佈局排列的多個塊。

雖然雙色調支持只是添加了一行額外的代碼,但繼續以當前形式處理塊是沒有意義的。 我很樂意將其視為單獨的 Post Author Avatar 塊的一部分。