Divi 插件亮點：Divi 上傳圖標

Divi Upload Icons 是 Divi 的第三方插件，可以輕鬆地向 Divi Builder 添加更多圖標。 與其他僅集成 Font Awesome 和 Material Icons 的圖標插件不同，這個插件可讓您添加所需的任何圖標集。 它必須是兼容的文件類型，並且恰好使用五種最流行的文件類型。

該插件會向您的 WordPress 安裝添加一個上傳器，您可以在其中拖放圖標文件。 然後將圖標添加到任何顯示圖標的 Divi 模塊中。 就像標準的 Divi 圖標一樣，您上傳的任何圖標集都可以使用 Divi Builder 進行樣式設置。 在這個 Divi 插件亮點中，我們將看看 Divi 上傳圖標，看看它是多麼容易使用。

安裝和激活 Divi 上傳圖標

正常上傳並激活插件，然後轉到儀表板菜單中的設置> Divi 上傳圖標以輸入您的激活密鑰。

使用 Divi 上傳圖標上傳圖標

設置屏幕中還有上傳功能。 在這裡，您將上傳您的圖標。 圖標必須是 .eot、.svg、.ttf、.woff、.woff2 和 .css 格式。 您可以從您想要的任何來源下載圖標，並將它們與 Divi Upload Icons 一起使用，只要它們採用這些格式並包含 CSS 文件。 要安裝圖標，請將它們拖放到上傳窗口中。 上傳區域中提供了說明，並且有一個演示如何使用它的簡短視頻。

圖標有時包括多種格式。 您必須將 CSS 文件與圖標一起上傳，並且圖標必須是受支持的文件。 在這個例子中，我上傳了幾組。 它們包括多種文件類型和 CSS 文件。 上圖中帶有橙色圖標的文件丟失了。

本例中的文件是正確的。 我已經上傳了支持的文件類型及其 CSS 文件。 我現在有超過 2500 個新圖標。 我從 iconfont、Dripicons、Foundation Icon Fonts 和 Map Icons 下載了它們。 開發人員維護了一個經過測試的圖標列表，您可以將其與 Divi Upload Icons 一起使用。 當然，您可以使用更多圖標。

為了進行比較，這是我上傳新圖標之前的 Divi 簡介模塊。 Divi 包含 360 個圖標。 您可以通過查看窗口中條的長度來了解有多少。

此圖像包含我上傳的所有 2500 個圖標。 我現在有更多的圖標可供選擇，而且窗口的欄要小得多。 您可以在 Visual Builder 中看到這些圖標，但它不包括新的過濾器和搜索工具。

Divi 上傳圖標過濾和搜索

如果您使用經典構建器，則會添加一個新的過濾器工具。 您可以打開或關閉過濾器。 在這個例子中它是關閉的。

單擊過濾圖標以查看您已安裝的圖標系列和搜索功能。 單擊任何圖標系列以僅查看該系列。 您還可以查看所有家庭或關閉過濾器和搜索選項。 過濾器工作得很快。 單擊圖標系列或搜索圖標幾乎立即顯示圖標，即使是我的 2500 個圖標。 我確定這部分取決於您安裝了多少圖標，因此您的體驗可能會有所不同。

在這個例子中，我選擇了我上傳的地圖圖標。 這個圖標系列中有近 200 個圖標。

這是基礎圖標。 它還具有近 200 個圖標。

這是Icofonts 。 這個圖標系列添加了 2000 多個圖標。

您可以按關鍵字或圖標系列名稱進行搜索。 結果包括來自您上傳的所有圖標系列和 Divi 中已經可用的圖標。

如果過濾器在搜索後工作以便按圖標系列查看結果，那將會很有趣。 當您將鼠標懸停在每個圖標上時，它會向您顯示帶有圖標系列的名稱。 在上圖中，我將鼠標懸停在右側的第二個圖標上。 這很有幫助，因此搜索過濾器並不是真正的高優先級。

Divi 上傳圖標示例

當然，使用圖標的好處之一是可以使用 Divi Builder 調整大小、顏色、添加圓圈、邊框等。 插件和圖標確實適用於 Visual Builder，但它不會在實時視圖中顯示圖標。 此示例顯示模塊圖標選擇中的圖標，但實時預覽不起作用。

圖標在發布的頁面或帖子上顯示得很好。 您仍然可以使用 Visual Builder 自定義大小和顏色，只是在實時預覽中看不到它們。 在自定義顏色和大小時，我更喜歡 Visual Builder，但我將在其餘示例中使用 Classic Builder。 這是來自 Mortgage 佈局包的登錄頁面。

圖標看起來很棒，可以像標準的 Divi 圖標一樣進行自定義。 我使用搜索功能找到了所有這些圖標。 這是默認設置。

我更改了顏色以匹配佈局，就像佈局使用的原始圖像一樣。

對於這個，我選擇使用圖標的字體大小並將其調整為 32px。 它開始看起來更像原始設計，但帶有我的圖標。

在這個中，我為每個圖標添加了一個圓圈。 我更改了圓圈和圖標的顏色，並在左數第二個和第四個添加了邊框。 我選擇了不同的顏色只是為了展示它們的樣子。

以下是圖標放置在文本左側的方式。

在這一個中，我用圖標替換了高爾夫球場佈局中的圖像。 我使用了佈局中的顏色並將它們調整為 48px。

在這個例子中，我禁用了圖標的字體大小調整。 這是默認大小，為 96 像素。 它們與佈局的設計很好地融合在一起。

使用圓形圖標設置時，它們看起來也很棒。 我將圖標顏色更改為白色，並使用佈局中的棕褐色作為圓圈的顏色。 圖標仍然是 48px。

對於這個，我使用了佈局中的一種綠色陰影。 Divi Builder 的自定義有很多可能性。

Divi 上傳圖標價格

Divi 上傳圖標售價 24.97 美元。 它具有無限的使用和更新。 您可以在市場上購買 Divi 上傳圖標。

結束的想法

Divi Upload Icons 可以輕鬆地從任何字體庫中上傳您想要的確切圖標。 該插件背後的想法是，您可以安裝要與 Divi 網站一起使用的確切圖標和圖標系列，而不是安裝數千個您不需要的圖標。

由於您將圖標上傳到 Divi Builder，因此它們存儲在您的服務器上。 我上傳了超過 2500 個圖標，並且 Divi Builder 或我的網站沒有速度問題。

請記住，它確實需要帶有字體文件和 CSS 文件的字體。 很容易錯誤地上傳字體（猜猜我是怎麼知道的）。 確保完全按照說明進行操作，否則字體將是空方塊。 此外，它不適用於 Font Awesome 5，但它適用於 4.7。

我喜歡使用 Divi 上傳圖標。 我想將它與 Visual Builder 一起使用，但它與經典構建器一起使用效果很好。 確實需要額外嘗試以確保我擁有正確的文件，但考慮到 Internet 上有多少圖標系列，花時間查找帶有正確文件的圖標是非常值得的。 圖標不難找到，開發人員提供了許多他已經測試過的圖標鏈接。

如果您有興趣將自己的圖標添加到 Divi Builder，Divi Upload Icons 值得一看。

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

精選圖片來自 hanss/shutterstock.com