Divi 插件亮點：用於 Divi 和 Extra 的 Caldera Forms 樣式定制器

已發表: 2017-10-29

Caldera Forms 在融入您網站的樣式方面做得很好。如果您想使用熟悉的 Divi 和 Extra Theme Customizer 樣式工具對其進行樣式設置怎麼辦？您可以使用名為 Caldera Forms Style Customizer for Divi 和 Extra 的第三方插件來執行此操作。

Caldera Forms 可以使用標準的 Theme Customizer 選項來設置樣式，但是，這些選項會設置主題的樣式。這意味著如果您更改表單文本的樣式，您也會更改網站正文的樣式。如果您想將表單與內容分開設置樣式，通常必須使用 CSS 手動設置樣式。 Caldera Forms Style Customizer for Divi and Extra 通過向主題定制器添加樣式功能解決了這個問題。

在這個插件亮點中，我們將看看 Divi 和 Extra 插件的 Caldera Forms Style Customizer，看看它是多麼容易使用。這個第三方插件可以通過 Caldera Forms 購買。顧名思義，它適用於 Divi 和 Extra。

安裝和激活

正常上傳並激活插件。沒有要調整的設置。這些功能已準備好使用。

自定義表單

我已將默認聯繫表單插入到具有所有默認樣式的頁面中。我將一次對這個表格進行所有調整。然後我們會看到一兩個例子。

新的樣式功能已添加到主題定制器中。打開主題定制器（或模塊定制器——它們都可以工作）並點擊Caldera Forms Style Customizer 。

這增加了 20 個新的自定義選項卡來自定義表單的各個方面，包括文本、按鈕、字段、切換開關、日期選擇器、麵包屑等。下面是每個設置的介紹。

文本字段

文本字段更改文本、佔位符和邊框的顏色，以及字段的邊框寬度、邊框半徑和單行高度。

文本字段懸停

文本字段懸停會更改文本、字段和邊框顏色。

文本字段焦點

文本字段焦點更改具有焦點的字段的文本、背景和邊框的顏色。在此示例中，中心的字段具有懸停功能，但具有深色背景的字段具有焦點。

下拉選擇

下拉選擇自定義背景、文本、箭頭和邊框顏色。您還可以調整邊框寬度和半徑。

下拉選擇懸停

下拉選擇懸停控制懸停時背景、文本、箭頭和邊框的顏色。

複選框和單選按鈕

複選框和單選按鈕調整復選框和單選按鈕的所選項目的顏色。

撥動開關

Toggle Switches 分別調整未選定和選定開關的背景、字體和邊框的顏色。您還可以同時調整兩個開關的邊框寬度和半徑。

切換開關懸停

Toggle Switches Hover 獨立調整選中和未選中開關的背景、字體和邊框的顏色。這是未選擇的開關。

藍色的是選定的開關。

提交按鈕

提交按鈕控制背景、字體和邊框顏色，以及邊框半徑、按鈕寬度及其位置。您還可以調整字體大小和字母間距。文本轉換功能會更改文本的大小寫。選擇小寫、大寫、大寫、首字母或繼承。

提交按鈕懸停

提交按鈕懸停控制背景、字體和邊框的懸停顏色。

復位按鈕

重置按鈕控制背景、字體和邊框顏色。您還可以調整字體大小和字母間距、按鈕寬度、按鈕位置、邊框寬度和邊框半徑。這個也有文本轉換。

重置按鈕懸停

重置按鈕懸停調整背景、文本和邊框的按鈕顏色。

其他按鈕

Caldera 有幾種其他類型的按鈕。其他按鈕控制除提交和重置之外的所有內容。調整字體、邊框和背景的顏色，並調整邊框寬度和半徑。在本例中，我創建了“上一個”和“下一個”按鈕。

其他按鈕懸停

其他按鈕懸停控製字體、邊框和背景的懸停顏色。

日期選擇器

日期選擇器在同一選項卡中包含常規顏色和懸停顏色。調整字體和背景的顏色。在本例中，我將鼠標懸停在 10 上，然後選擇了 12。

上傳文件列表

上傳文件列表控制上傳文件列表中背景和文本的顏色。

分節符

分節符控制分節符的顏色、邊框寬度以及上下邊距。

麵包屑

Breadcrumbs 允許您為活動頁面和其他鏈接、分隔符、背景和邊框的字體選擇顏色。調整邊框寬度和半徑。

成功提醒

成功警報調整字體、背景和邊框顏色，以及邊框半徑和寬度。它還可以調整框的高度。

各種各樣的

雜項使您可以控制所需圖標的顏色、錯誤字段、描述文本、信用卡顏色和信用卡圖標位置。描述文本包括字體大小、字母間距和文本轉換選項。我選擇了大寫。

例子

我創建了一個簡歷上傳表單（實際上這是內置在 Caldera Forms 中的，但我確實單擊了按鈕將其選中），並將其設置為模態。首先，我想使用 Divi Builder 設置頁面樣式。

我添加了一個背景圖像並選擇了對比而不是與背景混合的顏色。

這個使用具有不同背景的相同設置。這次我沒有在模態中使用表單。表單域不是白色背景，而是直接放置在圖像上。

進出口

導入或導出您在定制器中創建的 Caldera Forms 樣式很容易。在儀表板中，轉到Caldera Forms ， Styles – Import / Export 。這會將樣式導入和導出為 JSON 文件，使您可以在使用此插件的任何網站上輕鬆使用 Caldera 表單樣式。您的所有樣式都將被導入文件的樣式覆蓋。

許可和支持

該插件可以作為一年許可證（每年重複）購買。該許可證允許插件在一個、五個或十五個網站上使用（取決於您選擇的層級），並包括一年的支持和更新。

最後的想法

它發現這個插件易於使用。定制器設置很直觀。它們被很好地標記並以有意義的方式排列。我可以輕鬆找到我想要的任何設置。我想看看有什麼簡單的方法可以一次性恢復默認設置或進行全局調整（例如增加或減少所有顏色的整體暗度）。這可能不太現實，但聽起來很有趣。

無法使用自定義程序設置來設置單個表單的樣式。所有表單都使用與全局設置相同的樣式，並且必須使用 Caldera 的樣式功能單獨設置樣式。這是主題定制器的本質。如果您有興趣在全球範圍內為您的 Caldera Forms 設置樣式，那麼沒有比使用 Caldera Forms Style Customizer for Divi 和 Extra 更簡單的方法了。

我們希望聽到您的意見。 您是否嘗試過用於 Divi 和 Extra 插件的 Caldera Forms Style Customizer？ 請在評論中告訴我們您對此的看法。

精選圖片來自 Irina Strelnikova/shutterstock.com