ACF Blocks 提供從 Advanced Custom Fields Pro 構建的各種塊
已發表: 2020-05-07上週末，Munir Kamal 發布了他的 ACF Blocks 插件的 2.0 版，這是一個為編輯器創建一套塊的項目。 該插件在其免費版本中提供 18 個自定義塊，在專業升級中提供 15 個更多。 它建立在 Advanced Custom Fields Pro (ACF Pro) 之上。
該插件的最新更新增加了對排版的支持，包括使用各種 Google 字體進行塊內文本的選項。 Kamal 還包括用於設計功能的基本樣式選項，例如插件中每個塊的邊距和填充。
使用 ACF Pro 作為硬依賴，它限制了 ACF 塊的受眾。 在很大程度上，這個插件對於需要在預算範圍內為客戶快速構建功能的機構和自由職業者很有用。 為此，該插件做得很好。
與 ACF Pro 的緊密耦合會損害插件的用戶體驗。 但是，ACF Blocks 背後的思想及其自定義選項彌補了依賴其依賴父插件的缺點。 將兩者分離是不可能的，但它會帶來更流暢的體驗並將插件開放給更廣泛的受眾。
Kamal 從 ACF 及其專業版中獲得了插件的靈感。 他描述了使用框架構建塊的過程“超級簡單”，即使對於中級開發人員也是如此。 “多年來，創建自定義字段一直是一個非常棒的 WordPress 框架，”他說。 “當 [Elliot Condon] 宣布 ACF 中的塊創建功能時，這很快促使我構建了這個即用型 ACF 塊的集合。”
最大的技術限制是 Kamal 無法構建嵌套塊，這是 ACF 當前的限制。 “我已經與 [Condon] 討論過，他已經在致力於盡快推出該功能，”他說。 “一旦涉及到 ACF，我們可能會創造出更驚人、更強大的 Gutenberg Blocks。”
觀看插件如何工作的簡短演練：
有用的積木分類
在主要測試 ACF Blocks 的免費版本時，我發現它有幾個有用的塊可以立即滿足最終用戶的常見需求。 有 18 個可用塊，用戶在決定是否要升級到專業版之前有很多工作要做。
集合中最好的塊之一是照片拼貼塊。 這是 ACF Blocks 對核心 Gallery 塊的回答。 僅此塊的網格選項就使該插件值得一試。 該塊提供 2 到 15 個網格佈局，具體取決於用戶選擇的網格選項。
我第二喜歡的分類是推薦塊。 再加上適用於所有塊的排版選項，您可以在設計推薦部分時獲得很多樂趣。
這是插件可以做什麼的一小部分。 價目表塊可以幫助餐廳網站設置菜單。 定價框塊，尤其是嵌套在核心列塊中時，可以輕鬆設置具有多個產品選項的定價部分。 而且，團隊塊使在公司的團隊/關於頁面上創建個人資料部分變得簡單。
免費版中提供了以下塊（專業版中還有更多塊）：
- 可滾動圖像塊
- 選項卡塊
- 切換塊
- 手風琴塊
- 圖像滑塊
- 社交分享塊
- 照片拼貼塊
- 帖子塊
- 推薦塊
- 團隊塊
- 多按鈕塊
- 定價框塊
- 價目表塊
- 開始評分塊
- 進度條塊
- 計數器編號塊
- 點擊推文阻止
- 營業時間塊
整個套件中，Kamal 最喜歡的塊是 Image Hotspot，它允許用戶設置帶有“指針”的圖像背景以彈出內容； Before After Image，允許用戶使用滑動條比較兩張圖像； 和照片拼貼，插件的基於網格的畫廊塊。 前兩個僅在插件的專業版中可用。 插件創建者說他認為所有的塊都很有用，但這些是構建起來最有趣的。
改進空間
ACF Blocks 是一個不錯的概念。 它得到了很多正確的東西。 但是，有一些小問題會影響使用其塊的體驗。 這些問題並非不可克服，我希望 Kamal 將在即將發布的版本中解決這些問題，基於對他過去工作的熟悉度，並推動為用戶打造出色的產品。
最直接且可能最容易解決的問題是插件在每個塊上的左右邊距樣式。 該插件默認將這些邊距重置為0 。 根據站點上的活動主題，這可能會將塊移動到屏幕邊緣而不是前端的內容區域。 一些主題使用左/右邊距來對齊內容。 這不僅僅是 ACF 塊的問題。 它在具有前端輸出的插件中很普遍。
保證金問題的一種快速解決方案是將任何插件塊包裝在核心 Group 塊中。 這將把邊距重新置於主題的控制之下。
編輯塊內容髮生在塊選項面板中，而不是直接在塊中。 我不確定這是使用 ACF Pro 框架的限制還是 Kamal 的設計決定。 在內容區域的編輯內容和邊欄中的編輯內容之間跳轉感覺很奇怪。
我與塊內容混淆的一個例子是照片拼貼塊。 我單擊了該塊，希望出現媒體庫以供上傳。 沒啥事兒。 我再次點擊是因為，好吧，也許我第一次沒有得到很好的點擊。 沒啥事兒。 我最終在右側塊的選項面板下找到了圖像上傳按鈕。
設置塊選項有時會感覺有點遲鈍，因為編輯器中的塊輸出不會立即反映更改。 這主要是因為 ACF Blocks 依賴於 ACF Pro 的服務器端渲染功能。 這不太可能在塊插件中解決。 一些用戶在編輯多個選項時可能會發現延遲渲染很乏味。
最後的想法
Kamal 整理了一組有用的模塊，這些模塊將幫助許多最終用戶構建他們無法開箱即用的內容部分。 在免費版和專業版之間，總共有 33 個區塊。 創建者致力於根據用戶反饋隨著時間的推移添加更多塊。 在不久的將來，他計劃繼續進行錯誤修復和改進代碼。
我仍然覺得 ACF Pro 的工作方式阻礙瞭如果從頭開始構建這個插件的效果。 話雖如此，該框架幫助使 Kamal 的插件成為現實。 ACF Blocks 展示了通過 ACF Pro 實現的可能性，它應該會激勵其他正在尋找構建在 WordPress 生態系統中最廣泛使用的框架之一之上的解決方案的開發人員。
Kamal 了解一些 ACF Pro 用戶可能會嘗試創建類似的塊，但他覺得他的團隊的知識和提供支持的奉獻精神是等式中最重要的部分。 “ACF Blocks 節省了自己為最常見的網頁設計元素創建塊的時間和精力，”他說。
注意：此插件評論和反饋是插件作者要求的。 閱讀我們關於基於真實體驗的誠實反饋的帖子，以獲取有關如何處理評論的更多信息。