Divi 插件亮點：Divi 工具箱

Divi Toolbox 是一個第三方插件，它為 Divi 添加了許多通常需要 CSS、JavaScript、PHP 或許多單獨插件的新效果。 效果易於使用和自定義，並為您的 Divi 網站提供一些額外的亮點，以從人群中脫穎而出。

效果包括站點範圍的更改、新的移動菜單、粒子背景、頁腳、小部件、樣式、動畫、標題、導航、新博客佈局、新位置的 Divi 佈局、登錄屏幕自定義、彈出窗口等等。 許多功能可以通過主題定制器的新增功能來設計。 Divi Toolbox 不適用於 Extra 或 Divi Builder 插件。

Divi 工具箱常規設置

Divi 工具箱選項屏幕已添加到 Divi 儀表板菜單中。 此處啟用設置，但在自定義程序中進行調整。

常規設置包括全局標題樣式、自定義登錄頁面、隱藏項目、允許上傳 SVG 文件類型、自定義瀏覽器滾動條、404 頁面設置（選擇佈局並隱藏頁眉和頁腳）和社交圖標設置（啟用樣式、打開方式）一個新選項卡，並添加更多圖標）。

添加更多社交圖標會打開一個字段，您可以在其中輸入另外 9 個社交網絡的 URL。

這是自定義程序中的“常規”選項卡，我可以在其中調整已啟用的設置。 設置包括標題和字體、瀏覽器滾動條和登錄屏幕。 在此示例中，我對 h1 和正文文本進行了一些調整，並為滾動條添加了樣式。 我還添加了更多社交圖標。

對於登錄屏幕，您必須進行更改，然後註銷或在另一個瀏覽器中查看該屏幕。

這是添加背景圖像、徽標並更改字段和文本的大小和顏色後的登錄屏幕。 這確實需要一些調整，因為您在進行更改時看不到屏幕。

Divi 工具箱標題設置

Header設置為菜單添加樣式，啟用自定義下拉菜單，添加 CTA 菜單按鈕，更改固定菜單上的標誌，啟用重疊標誌，並在首頁導航前添加 Divi 佈局，以及前後佈局其他頁面的導航。

CTA 菜單按鈕可讓您將 CTA 應用於第一個或最後一個菜單項，或應用自定義類。 它提供了 CSS 和有關添加它的位置的說明。

這是標題的定制器。 我在菜單上方添加了一個佈局（在這個例子中它只是一個文本模塊，但如果你願意，你可以添加一個完整的佈局）。 重疊的標誌有一個帶有陰影效果的方框。 我將徽標大小從 200 更改為 140，並將社交圖標移至主菜單。 我將鼠標懸停在“服務”菜單項上，以便您可以看到 CSS 效果。

Divi 工具箱頁腳設置

頁腳設置包括粘性頁腳、頁腳顯示、自定義菜單和小部件、自定義返回頂部按鈕（添加自定義按鈕鏈接選項）以及添加前後頁腳佈局。

在此示例中，我將標題和菜單字體更改為全部大寫並增加了間距。 我還調整了懸停顏色並在懸停文本旁邊添加了一個圖標。 我在頁腳佈局之後添加了一個佈局。 這個使用了一個顯示的頁腳（這就是為什麼文本在它上面的文本模塊後面）。

我已經設計了返回頂部按鈕的樣式，以便它顯示文本。 它有陰影效果，我已經調整了它的位置。 我保留了默認顏色。 我已將底部文本和社交圖標居中。 對於懸停效果，我選擇了 Grow（它還包括收縮、向上移動、向下移動、擺動、心跳、果凍和脈衝）。 我將鼠標懸停在 Facebook 圖標上，以便您可以看到效果。

Divi 工具箱移動設置

移動設置包括輸入移動菜單斷點的字段（菜單從桌面更改為移動時的確切屏幕寬度）、自定義樣式、更改徽標、選擇漢堡圖標單擊效果、折疊嵌套子菜單和啟用幾個 CSS 類。 CSS 類允許您反轉列並使文本、模塊和按鈕居中。

下面是在 Google Chrome 中選擇響應式的頁面。 一旦我將屏幕尺寸縮小到 980 像素以下，它就會更改為我選擇的移動圖標，並添加了帶有我選擇的動畫的漢堡菜單。

在此屏幕中，我正在為移動菜單的背景顏色、懸停背景顏色和漢堡菜單設置樣式。 我已將主菜單項的文本更改為全部大寫，並保留了 CTA 文本標準。 我還更改了 CTA 菜單項的背景。 您還可以調整菜單和圖標大小。

Divi 工具箱博客設置

博客設置允許您自定義側邊欄和小部件、帖子元、存檔和類別頁面、選擇佈局（從 6 個選項中）、隱藏存檔側邊欄以及自定義閱讀更多按鈕文本。

對於單個帖子，您可以選擇側邊欄佈局、隱藏帖子標題、添加作者框、添加上一個和下一個鏈接、添加相關帖子以及自定義評論表單。 您還可以在導航到單個帖子、檔案、類別、作者頁面和搜索結果頁面後添加自定義佈局。

對於博客頁面，我在側邊欄添加了陰影效果，更改了字體及其樣式，並設置了搜索框的樣式並增加了邊框的大小。 它使用交替佈局，我自定義了閱讀更多按鈕文本。

這個例子是佈局 6。我再次自定義了元字體顏色並添加了懸停顏色。 我還自定義了閱讀更多按鈕背景。

單獨的博客文章讓您可以自定義您在博客設置中添加的每個元素。 在此屏幕中，我正在自定義相關帖子、下一個和上一個鏈接以及作者框。 您可以控制所有文本、顏色、陰影等。

在此示例中，我正在自定義評論表單。 您可以控製字段的顏色（焦點和非焦點）、邊框、文本、顏色、按鈕等。我更改了按鈕背景顏色、字段的焦點顏色、向字段添加了邊框，並更改了半徑。

Divi 工具箱模塊設置

Modules選項卡提供了添加跟隨鼠標懸停效果的設置，添加了一個纖薄的電子郵件選擇（它提供了三個不同選項的 CSS）、輔助按鈕（它添加了一個新的自定義層）和許多調整。

調整包括用於手風琴和切換模塊的動畫三角形圖標，刪除定價表的水平底部邊框和填充，在推薦內容下方移動縱向圖像，隱藏水平滾動條，以及添加 CSS 以垂直對齊列和更改高度任何元素到其視口高度的 100%。

以下是選擇加入的精簡電子郵件。 它將所有字段放在一行中。 此示例還使用輔助按鈕。 只有我添加了 CSS 類的按鈕才會獲得這些更改。 使用 CSS 類意味著我現在有兩個全局按鈕樣式。

Divi 工具箱附加設置

Extras選項卡包括預加載器、彈出窗口、粒子背景、3D 傾斜效果和模塊的視差滾動。

有 12 種預加載器可供選擇。 如果需要，您可以讓它們只出現在主頁上，並選擇它們的過渡類型和速度。 選擇器屏幕顯示預加載器的動畫。 您可以在主題定制器中進一步定制它們。

使用菜單項、按鈕、文本中的鏈接等中的任何鏈接觸發彈出窗口。創建任意數量的窗口。 為彈出窗口選擇任何預製佈局。 在定制器中定制背景和關閉按鈕。

這是移動的粒子。 您可以完全控制顏色、形狀、粒子數量、速度、大小、線條大小、不透明度和交互性。 有兩個用於粒子的 CSS ID，讓您有兩種不同的設計。

下面來看看傾斜功能。 您可以調整傾斜度、視角、比例、速度和眩光。 將其添加到任何部分、行或模塊。

Divi 工具箱許可證

有兩種許可證可供選擇：

• 常規許可證（用於一個項目）– 49.00 歐元
• 擴展許可證（用於無限項目）– €169.00

結束的想法

這個插件的功能和設置給我留下了深刻的印象。 我特別喜歡它為不是使用 Divi 構建器創建的博客文章添加相關帖子、上一個和下一個鏈接以及作者框。 滾動條也是一個很好的接觸。

您可以在 Divi 模塊中訪問一些設置，例如標題文本，但這為這些設置提供了更多詳細信息。 我希望添加更多調整（例如，評論框的陰影效果、更多徽標選項、社交媒體圖標放置等）。

如果您有興趣以最簡單的方式向 Divi 添加大量新效果，Divi Toolbox 值得一看。

我們希望聽到您的意見。 您是否嘗試過 Divi 工具箱？ 在下面的評論中讓我們知道您的體驗。

特色圖片來自 vasabii/shutterstock.com