ACF vs Divi設計變量：何時使用

借助Divi 5的最新Alpha版本，設計變量已進入Divi生態系統，作為在網站上管理設計和內容值的一種新方法。這使我們的用戶興奮，尤其是那些多年來一直依賴高級定制領域（ACF）的人。您應該堅持使用ACF還是切換到Divi的變量？還是可以同時使用兩者？

這篇文章解釋了差異以及何時應該使用。讓我們開始！

Divi 5已準備好用於新網站構建。

什麼是Divi設計變量？

構建網站時，您通常會在許多頁面上重複使用相同的信息，從顏色到字體樣式，聯繫方式等等。設計變量可幫助您從一個中心位置管理這些共享元素。與標準的ACF字段不同，設計變量與特定於後的內容無關，它們充當全局設計和內容值，而不是動態內容字段。

您沒有挖掘每個頁面進行次要更新，例如更改電話號碼或調整背景顏色，而是一次更新一個變量，並且整個網站自動更改流量。

是否想將品牌顏色切換為季節性促銷？更改單個變量。需要更新您的頁腳文字或徽標嗎？一個編輯會立即更新每個實例。借助Divi的設計變量，您不僅更快地進行樣式，而且更聰明。

構建更聰明且易於更高的網站

標準ACF字段通過創建與特定帖子綁定的自定義字段來改善WordPress用戶如何構建設計和內容。 Divi的設計變量採用完全不同的路線。它們是全球可訪問的設計值，可以立即在任何地方更新。最初的區別可能看起來很微妙，但是它會改變您構建和維護WordPress站點的方式。

ACF帶來了什麼

高級自定義字段（ACF）允許您在其核心版本中為您的頁面和帖子添加額外的數據字段。您不僅獲得了基本標題和內容框。 ACF為您提供圖片，文本塊，文件，下拉菜單等的特殊字段。

您可以將相關字段捆綁到項目的邏輯組中。例如，您可能會成為一個工作人員組，其中有職位，部門，照片和生物的位置。或使用用於規格，定價和功能列表的字段創建產品詳細信息。

這些現場組與自定義帖子類型非常有效。將它們結合起來時，您可以構建特殊內容部分，例如團隊目錄，服務列表或屬性目錄，每個內容都具有適合該內容的正確字段。

人們之所以喜歡ACF，是因為它可以平穩地適合常規WordPress管理區域。您的自定義字段在普通編輯屏幕上顯示，這使得不精通技術的客戶更新內容變得容易。

選項頁面：您的網站範圍控制面板

ACF選件頁面（在ACF Pro中可用），讓您創建一個與特定內容相關的常規ACF字段不同的網站範圍信息的中心位置。此功能非常適合：

• 聯繫信息
• 重要鏈接
• 營業時間和地點
• 默認圖像和徽標

當某些東西發生更改（例如電話號碼）時，您只需要在“管理員”部分中更新一次。更改將立即顯示在您網站上的任何地方。值得注意的是，您將需要ACF Pro使用選項頁面。

與Divi的深入整合

標準ACF字段通過Divi的動態內容系統很好地與Divi配對。當您在Divi Builder中製作頁面時，您可以從ACF自定義字段中獲取信息。該團隊合作使您可以將Divi的設計工具與ACF的內容管理一起使用。

這是該過程通常工作的方式：

• 使用ACF設置自定義字段
• 用WordPress中的內容填充這些字段
• 在Divi中設計您的頁面佈局
• 將您的ACF內容連接到Divi模塊

Divi和ACF的這種組合創造了有用的分離。內容編輯器可以在乾淨，有組織的界面中更新信息，而設計人員可以構建佈局，而不會在內容管理詳細信息中陷入困境。

靈活的方法

標準ACF字段可用於您的技能，無論您是代碼還是喜歡視覺工具。開發人員可以使用模板函數在自定義主題中顯示字段值。如果您不編碼，您仍然可以在不知道PHP的情況下將ACF字段與諸如Divi之類的構建器使用。

這種靈活性使標準ACF字段適用於基本業務網站和復雜項目。您可以從簡單的功能開始，並在學習和網站增長時使用更高級的功能。

Divi設計變量的靈活性

Divi 5設計變量使網站管理變得更加簡單。他們存儲設計選擇和可重複使用的內容，您可以在網站上的任何地方使用。當您更新一個變量時，它在使用它的任何地方都會更改。

通過單擊Divi 5的Visual Builder側邊欄中的變量圖標來找到變量管理器。它使您可以在一個地方管理所有設計元素。

六種類型的設計變量

Divi 5包括六種不同類型的變量，以幫助您網站的各個方面：

• 顏色變量：保持您的品牌顏色，文字顏色和背景
  • 您可以清楚地命名它們，例如“珊瑚腮紅”或“香檳金”
  • 將它們用於按鈕，文本，背景和邊界
  • 然後，您可以通過更新這幾個變量來更改整個配色方案
• 字體變量：設置排版選項超出主題定制器
  • 您可以為標題，身體文本或特殊區域創建單獨的字體設置
  • 這使您的網站上的排版保持一致
  • 如果需要，您可以一次更新所有字體
• 數字變量：設計中使用的商店測量值
  • 非常適合間距，邊界，大小和文本維度
  • 使用Clamp（）等CSS單元進行響應式設計
  • 這些幫助您在任何地方保持間距和尺寸穩定

Divi 5變量還處理整個網站中顯示的內容：

• 圖像變量：存儲在多個地方使用的圖片
  • 非常適合徽標，背景圖案和照片
  • 更新圖像一次，而不是在每個頁面上
  • 進行季節性更新或更快地重新品牌
• 文本變量：保存出現在許多位置的書面內容
  • 對於聯繫信息，標語和工作時間有用
  • 更改文本一次以更新到處
  • 細節更改時保持信息一致
• 鏈接變量：存儲按鈕和菜單的URL
  • 用於操作按鈕，社交媒體鏈接和導航
  • 避免使用網絡地址更改時斷開的鏈接
  • 添加新頁面時立即更新所有相關按鈕

現實世界的好處

設計變量節省了時間並減少錯誤，因為它是視覺上的。當客戶想要更改其網站顏色時，您可以僅更新顏色變量，以及與該顏色（按鈕，背景和文本）的所有內容都立即在整個網站上更改。

這些變量與Divi的預設系統很好地工作。將變量添加到模塊預設中，當您更新變量時，每個具有該變量的模塊會更改。

對於在所有設備上看起來都不錯的網站，具有CSS功能的數字變量（例如Clamp（）可以幫助您的佈局適合任何屏幕尺寸，而無需單獨的設計。當多人在網站上工作時，設計變量使每個人都使用相同的設計規則。無論誰進行更改，這都可以幫助該網站保持一致和專業。

他們如何比較

在比較標準ACF字段和Divi的設計變量時，我們正在研究使網站更易於管理的兩種不同的方法。讓我們分解它們的核心差異：

當您需要在帖子和頁面之間更改的結構化內容時，標準ACF字段會發光，而Divi Desive變量則保持範圍內的設計一致性。在某些方面，ACF選項頁面（ACF Pro中可用）和Divi Design變量相似：

重要的是要了解，Divi設計變量並沒有嘗試做ACF Pro所做的一切。他們為您提供另一種存儲和使用相同信息的方式。 ACF仍然可以做很多Divi變量無法做到的事情：

Divi變量非常適合簡單的工作，例如更改聯繫信息，將照片與季節交換或更新您的品牌顏色。 ACF非常適合除了設計元素之外需要專業內容管理的網站，例如創建自定義字段和帖子類型。同樣，ACF Pro可用的ACF選項頁面是Divi設計變量的更成熟版本。

但是，Divi的設計變量以無需額外費用內置在Divi 5中。您可以在已經使用的構建器中設置顏色，字體，文本和圖像。無需額外的插件或學習新系統。您的項目要求應指導哪種系統在您的工作流程中扮演主角，但請記住，儘管它們的表面相似性，但這些工具仍解決了根本不同的問題。

ACF和Divi變量可以一起工作嗎？

是的。您實際上可以在同一網站上同時使用標準ACF字段和Divi設計變量。他們一起工作得很好，因為他們處理網站的不同部分。當您將它們配對時，標準ACF字段可以處理複雜的數據關係，例如房地產網站，以及與代理，鄰里和定價自定義字段相連的屬性清單類型。

同時，設計變量可以使您的品牌顏色，排版和間距在每個頁面和帖子模板中保持一致。這意味著您的網站具有強大的數據管理和視覺一致性。

您的內容編輯器可以使用ACF熟悉的字段來更新屬性詳細信息或定價，而您的網站則通過Divi的設計系統保持其專業外觀。這種組合為您提供了比任何一個工具所能提供的更好的控制權。

關鍵是知道每個作業要使用哪種工具。通過了解他們的優勢，您可以建立具有復雜內容結構的網站，這些結構仍然保持著凝聚力的視覺標識。讓我們看一下這些工具如何一起解決常見網站問題的真實示例。

用例1-本地商業網站，具有季節性更改

當地的麵包店網站需要結構化的內容和季節性設計更新。我們以實用的方式將標準ACF字段和Divi設計變量組合在一起。

標準ACF字段處理麵包店的產品目錄，並具有自定義郵政類型和字段：

• 專案
• 項目描述
• 成分和過敏原信息
• 定價層
• 可用性狀態

這些細節會改變每種產品，因此ACF的結構化方法完美地運作。麵包店員工通過ACF熟悉的WordPress接口更新產品信息。

同時，Divi設計變量管理季節性設計元素：

• 隨著季節改變的配色方案
• 假期促銷橫幅文字
• 主頁上的特色產品圖像
• 每月刷新的背景模式

當秋季到來時，麵包店老闆只是將季節性顏色變量從夏季粉彩更新為秋季色調，整個網站都會立即刷新。

背景圖像更改以顯示以秋季為主題的裝飾，而無需使用圖像變量單獨編輯每個頁面：

這種設置為麵包店提供了兩者中最好的：通過標準ACF字段結構化產品數據，並通過Divi的設計變量快速季節性刷新。

用例2-攝影作品集網站

攝影業務網站需要平衡有組織的客戶畫廊與一致的視覺品牌。這是標準ACF字段和Divi設計變量解決這一挑戰的方式。標準ACF字段管理結構化內容方面：

• 客戶項目畫廊作為自定義帖子類型
• 自定義字段：
  • 帶有詳細定價字段的服務包
  • 帶有客戶名稱的推薦收集
  • 項目類型
  • 設備規格

攝影師通過ACF的界面更新每個客戶庫，並補充：

• 項目日期和位置
• 基本信息
• 圖像排序和分類

同時，Divi設計變量處理品牌一致性：

• 所有標題和身體文本的版式系統
• 在所有頁面上都應用品牌調色板
• 一致佈局節奏的間距值
• 畫廊網格設置用於統一演示

需要品牌刷新嗎？攝影師更新了一些設計變量，整個站點都會發生變化。畫廊由於數量變量而保持間距，每個項目都歸功於ACF。

當婚禮季節忙碌時，攝影師將一個文本變量更改為預訂狀態，並在網站上到處更新。不再檢查每個頁面以修復相同的文本。這種組合使照片和客戶端信息（在ACF中）與網站的外觀（帶有設計變量）分開，因此攝影師可以正確獲得結構和外觀。

為您的項目做出正確的選擇

查看我們的麵包店和攝影示例，我們可以看到這些工具應對不同的網站挑戰。麵包店老闆更新產品信息，同時毫不費力地交換季節性顏色。攝影師井井有條，只需單擊幾下即可更新網站的外觀。

有些站點只需要其中一種工具，而另一些網站則可以更好地工作。一件事很清楚：在標準ACF字段和Divi設計變量之間進行選擇不一定是一個或決定。

Divi 5為您的工具包添加了另一個有用的選項。無論您是構建簡單還是複雜的東西，您現在都有更多的方法來創建看起來不錯且運行良好的網站。

開始更聰明地建造

最重要的是，Divi 5的設計變量和標準ACF字段每個都解決了不同的問題，同時有一些重疊（尤其是與選項頁面）。需要在您的網站上快速設計更新嗎？設計變量發光。想要有條件邏輯的強大內容管理嗎？標準ACF字段交付。

許多站點都可以並排使用兩個工具。 ACF選項頁面更適合管理複雜的內容需求。設計變量並不是要完全替換選項頁面，而是對於大多數具有簡單要求的用戶，它們可能是一個強大的選擇。

Divi 5現在可以使用設計變量功能 - 無需額外費用，不需要編碼，並且可以為您的下一個項目準備。

請記住：Divi 5最適合新網站。我們不建議將現有站點轉移到Divi 5。