Gutenberg 11.9 專注於導航菜單和塊主題

已發表: 2021-11-13

Gutenberg 11.9 於週三登陸,它包含了許多增強功能。 貢獻者正在加速前進,在 12 月 14 日發布 WordPress 5.9 之前獲得一些最終功能。

11.9 版是最後一個包含即將到來的 WordPress 更新的新功能的插件版本。 錯誤修復將在未來幾週內繼續移植。

站點編輯和與主題相關的塊佔據了大部分的聚光燈。 WordPress 5.9 將附帶其第一個默認塊主題,二十二十二。 對於許多用戶來說,這將是他們第一次體驗模板編輯和全局樣式。

導航塊受到了很多關注,這是正確的。 開發人員解決了一些重要的數據可移植性問題,並創造了更全面的用戶體驗。

整體上還有很大的提升空間,但古騰堡在過去的幾個月裡已經取得了長足的進步。 我對新功能在通用 WordPress 版本中的外觀感到興奮。

站點編輯器縮小,其菜單移動並重命名

WordPress 網站編輯器。左側的模板編輯畫布,右側的全局樣式選項。
網站編輯器有二十二十二活躍。

站點編輯器已縮小到不再是古騰堡插件用戶在過去幾個月中習慣的功能的地步。 它本質上是通向全局樣式功能的途徑。

對於模板,只有網站的主頁可以通過界面訪問。 單擊編輯器左上角的“W”圖標不再打開熟悉的模板面板,以前允許用戶導航、選擇和自定義單個模板。

單擊“瀏覽所有模板”按鈕將用戶從站點編輯器帶到模板屏幕。 它看起來像一個帖子列表,並且不包含有關如何覆蓋作者檔案或其他主題模板的說明。 我對系統非常了解,可以理解正在發生的事情,但我只能想像這對普通用戶來說會令人震驚。

用戶可以通過單擊下拉菜單中的頁面跳轉到站點編輯器中的頁眉和頁腳區域。 編輯器只關注那些模板部分而不切換屏幕。

但是,我看不到從站點編輯器中編輯特定模板的方法。 結果是具有全局樣式的淡化索引模板編輯器,這是一個可取的功能。

站點編輯器菜單項現在也已移至 WordPress 管理員的外觀菜單下方。 它現在被簡單地命名為“編輯器”。 當然,“主題編輯器”子菜單仍然存在。

WordPress 主題文件編輯器,在同一子菜單列表中顯示另一個“編輯器”。
兩種外觀編輯器。

我不認為這會讓用戶感到困惑……

撇開諷刺不談,這是新站點編輯器的合適位置,只有在用戶激活了塊主題時才會出現。 但是,這兩個子菜單名稱明顯衝突。 有沒有更好的地方來移動主題編輯器? 一項提案將其放在管理菜單中的工具下。

人們一定想知道在塊世界中直接編輯主題文件會有多大用處。 可以通過 UI 覆蓋模板。 theme.json設置通過全局樣式接口處理。 這主要只是讓functions.php成為唯一的堅持。 可能是時候在 WordPress 中默認禁用文件編輯了,至少對於塊主題是這樣。

模式探索者

從彈出疊加層查看的塊模式瀏覽器。它具有一個左側邊欄的類別和一個帶有兩列各種塊模式的右側部分。
塊模式瀏覽器。

台式機和平板電腦上的用戶現在可以享受全屏圖案疊加。 他們無需在狹窄的插入器中無休止地滾動瀏覽數十個甚至數百個模式,而是可以單擊一個新的“探索”按鈕,在具有更多呼吸空間的界面中探索模式。

本週早些時候,我在完整的評論中介紹了這個新功能。 該設計仍有一些問題需要解決,但到目前為止效果很好。 它還為後續更廣泛的功能集奠定了基礎。

導航數據保存和導航區域塊

導航塊數據現在存儲在專用的wp_navigation帖子類型中。 通過單獨保存它,貢獻者現在糾正了基於塊的導航菜單長期存在的問題之一:可移植性。

在該塊的先前迭代中,每當用戶切換到新的塊主題時,都會丟失他們精心製作的菜單。 他們將不得不重新創建通常不會經常更改的內容。

除了這項改進之外,還有一個新的 Navigation Area 塊,它用作 Navigation 的包裝器。 主題作者將能夠使用以下代碼在其塊主題模板中定義自定義區域:

 <!-- wp:navigation-area {"area":"primary"} --> <!-- wp:navigation /--> <!-- /wp:navigation-area -->

嵌套的 Navigation 塊與wp_navigation post相關聯。 這將是未來主題作者的首選格式。

當用戶切換主題並且“區域”名稱與他們以前的主題匹配時,菜單會簡單地繼續並自動出現。 如果它們不匹配,用戶可以分配一個保存的菜單。 菜單/區域關係存儲在數據庫中。

導航區域塊的問題之一是它沒有對齊控件。 從技術上講,它本身不輸出任何 HTML。 但是,它在編輯器中的存在禁止用戶為其內部導航塊選擇寬對齊或完全對齊。

雙色調濾鏡透明度

圖像和封面等塊上的雙色調濾鏡現在支持透明度。 調整陰影或高光時,用戶現在將在顏色選擇器下方看到一個滑塊控件。

該功能通過在封面上疊加圖像塊來打開雙重曝光效果或圖像蒙版的大門。 亞歷克斯·倫德(Alex Lende)展示了一些如何在票證中發揮作用的例子。

帶有透明雙色調的圖像疊加在封面塊上。

開發人員還指出了三全音選項和其他過濾器類型的可能性。

用於訪問全局樣式的 API

主題和插件作者應該對這個與全局樣式系統交互的新 API 感到滿意。 以前,開發人員必須使用WP_Theme_JSON_Resolver類在服務器端提取他們需要的數據。 現在,它們具有三個新功能:

  • gutenberg_get_global_settings() – 返回設置。
  • gutenberg_get_global_styles() – 返回樣式設置。
  • gutenberg_get_global_stylesheet() – 返回全局樣式表。

據推測,這些函數將在登陸 WordPress 5.9 之前被重命名,並且沒有gutenberg_前綴。 為了安全起見,主題作者應該在function_exist()檢查中包含這些的任何用法。

新的評論塊

最新的插件更新中出現了幾個新的評論塊。 評論查詢循環和評論模板塊的工作方式與其對應的帖子類似。 但是,當前的結果是尚未準備好用於生產的基本功能。 嵌套註釋不顯示,自定義輸出的選項也不多。

這是阻止主題作者和用戶(通過站點編輯器)控制帖子評論輸出的一步。 Gutenberg 11.9 還包括模板所需的新註釋幫助塊:

  • 評論回复鏈接
  • 評論鏈接
  • 評論頭像

有一段時間,評論感覺像是事後才想到的。 歡迎任何旨在完善這些缺失的主題相關塊的運動。