Divi 插件亮點：WP 和 Divi 圖標

WP 和 Divi Icons 是 WordPress 的第三方插件，可與任何 WordPress 主題配合使用並集成到 Divi Builder 中。 為了與 Divi 一起使用，它包括您可以在項目中使用的專有佈局。 這些圖標在 WordPress 編輯器和任何允許您選擇圖標的 Divi 模塊中可用。 在本文中，我們將看看 WP 和 Divi Icons，看看是什麼讓它與眾不同。

WP 和 Divi Icons 為 WordPress 添加了 2500 多個圖標。 它包括 Font Awesome 圖標、材質圖標和 450 個自定義設計的圖標，其中包括 48 個多色圖標。 它有免費版和專業版。 我正在測試專業版。

安裝 WP 和 Divi 圖標

正常上傳並激活插件。 我將 1.1.0 版與 Divi 3.17 版和 WordPress 4.9.8 一起使用。

接下來，您需要激活您的許可證。 您可以導航到激活屏幕或單擊屏幕頂部顯示的消息。 不過，知道如何在那裡導航仍然很有幫助，因為一旦您輸入許可證密鑰，此頁面將成為選項屏幕。

無論您使用什麼主題，都要進入屏幕，單擊插件列表中插件描述中的說明鏈接。 如果您使用的是 Divi，則會在儀表板中的 Divi 菜單中添加一個名為 WP 和 Divi 圖標的新菜單項。 單擊此按鈕並輸入您的許可證密鑰。

自定義多色圖標

輸入您的許可證密鑰後，它會打開帶有說明的屏幕、48 個多色圖標的列表以及為這些圖標創建您自己的配色方案的工具。

您可以控制三種顏色。 調整顏色控件並等待幾秒鐘以查看結果。 單擊刪除將刪除配色方案。 這些顏色添加了一點陰影效果，從而為每種顏色創建了較暗的版本，看起來很神奇。

單擊添加配色方案會創建一組新的多色圖標，您可以對其進行調整。

根據需要添加盡可能多的配色方案。 這極大地擴展了您可以使用圖標執行的操作。 控件很直觀。 事實證明，我發現這有點讓人上癮。

在任何主題的 WordPress 中使用 WP 和 Divi 圖標

要使用任何主題的圖標，請選擇添加到 WordPress 編輯器的新圖標。

這將打開編輯器，您可以在其中選擇圖標、通過在顏色字段中鍵入或使用顏色選擇器來編輯顏色、通過輸入以像素為單位的數字或使用滑塊更改大小、添加標題和添加類。 您還可以搜索圖標。

您所做的任何更改都會實時顯示。 在這個例子中，我輸入了我想要的顏色，將大小更改為 106 像素，並將名稱更改為 Green Leaf。

單擊確定將圖標添加到您的內容中。

雙擊圖標打開編輯器並進行更改。

單擊“確定” ，更改將反映到內容中的圖標上。

此編輯器不編輯多色圖標。 您必須在我上面演示的主設置屏幕中編輯它們。 您仍然可以從此編輯器中選擇它們、更改它們的大小、添加標題、添加類以及從此處將它們插入到您的內容中。

圖標在內容中看起來很棒。

在 Divi Builder 中使用 WP 和 Divi 圖標

Divi Builder 中添加了許多新圖標，可以從允許您選擇圖標的任何模塊訪問這些圖標。 添加了一個新的搜索功能，圖標更大，更容易看到（這表明這個插件可能是由像我這樣的老傢伙設計的。我既能理解也能欣賞這個功能）。

我希望添加一個過濾器，以便我可以在 Font Awesome、Material 或自定義圖標之間進行選擇。 通過這種方式，如果我想要與其他人不同的東西，或者只使用 Font Awesome 或 Material Icons 構建，或者有選擇地混合我的圖標，我可以輕鬆地看到自定義圖標並忽略 Font Awesome 和 Material 圖標。

它包括單色和多色圖標。

從前端實時搜索和更改圖標。

它們就像任何 Divi 圖標一樣可調節。

您還可以從前端構建器添加多色圖標。 您不能在此處調整圖標的顏色（這是在多色圖標編輯器中完成的），但您可以從模塊的設置中添加一個圓圈、添加一個邊框、調整它們的顏色以及調整圖標的大小。

在這個例子中，我添加了一個帶邊框的圓。

您可以從前端和後端使用它們。

Divi 文本模塊中也提供了 WordPress 圖標編輯器。 該編輯器的工作原理與任何 WordPress 主題完全相同。

WP 和 Divi 圖標佈局

該插件適用於任何主題，但它確實具有僅適用於 Divi 的特殊功能。 將它與 Divi 一起使用的最大優勢之一是獨家自定義佈局。 它們是使用 WP 和 Divi Icons 定制設計的，下載鏈接僅在插件中可用。 它們可供任何擁有插件的人下載，並可用於任何項目。 它們是具有許多樣式模塊的完整佈局。

已經有幾個可用的，還有幾個在路上。 以下是對每個圖標的介紹，重點介紹他們如何使用圖標。 您可以在開發人員的演示頁面上看到它們。

電商佈局

此佈局包括帶有氣泡的樣式標題，以顯示公司使用的支付網關和運輸合作夥伴的類型。 多色圖標顯示所提供的服務。 它的工作原理顯示在選項卡中。 它還包括定價表、推薦信、FAQ 的時事通訊註冊和頁腳。

創意機構佈局

這包括一個風格化的標題、一個關於你提供的服務類型的區域、一個投資組合、一個涵蓋你的工作方式和你採取的步驟的滑塊、推薦、獎項、關於你的團隊、聯繫人和頁腳。 它使用了許多斜角和深陰影效果。 彩色圖標顯示服務。

商業佈局深色

這個有一個兩列標題，一側是圖像，另一側是文本。 顯示您提供的服務的部分使用多色圖標，並在頁面下方交替顯示圖像和文本。 其他部分使用大背景文本並顯示公司的歷史、覆蓋層中帶有彩色圖標的團隊成員、聯繫表格、聯繫信息和頁腳。

商業佈局燈

這是與業務佈局深色相同的佈局，但顏色較淺。

非營利佈局

這顯示了一個全屏圖像滑塊，右側有一個垂直菜單，並使用社交關注按鈕的圖標。 下面的一個細長部分顯示了捐贈 CTA。 它還包括關於部分、您支持的原因、事件部分、項目、帶有圖標的簡介、贊助商和頁腳。

許可證和文件

價格範圍從限量版免費、單個站點 39 美元、3 個站點 59 美元和無限制站點 79 美元不等。 您可以在開發者的網站上購買該插件。

它包括高級支持和 3 年更新。 開發人員的網站上提供了文檔。

結束的想法

WP 和 Divi Icons 易於使用。 當我在 Divi 模塊中單擊它們時，加載圖標確實需要幾秒鐘的時間。 我敢肯定，這主要是由於我的“歡迎來到鄉村生活”互聯網連接速度較慢。 我希望看到添加到 Divi 模塊的過濾器。 搜索功能有助於根據關鍵字查找圖標。

我喜歡它添加了 Font Awesome 和 Material Icons，但我最喜歡的是自定義圖標——尤其是多色圖標。 編輯器使用起來很簡單有趣。 我認為即使沒有 Divi，它也是一個很棒的插件，但由於免費佈局，Divi 甚至更好。

我們希望聽到您的意見。 您是否嘗試過 WP 和 Divi 圖標？ 請在評論中告訴我們您對此的看法。

特色圖片來自 VectorsMarket/shutterstock.com