Divi 插件亮點：Divi Ribbon 模塊

Divi Ribbon Module 是 Divi 的第三方插件，可為模塊的內容添加可樣式化的功能區。 根據需要添加圖像、按鈕、標題、內容和每個元素的樣式。 使用它來突出產品銷售、建立號召性用語或引起對任何元素的注意。 在這個 Divi 插件亮點中，我們將看看 Divi Ribbon Module，看看它可以做什麼。

安裝 Divi Ribbon 模塊

1. 前往並下載插件
2. 在 WordPress 儀表板中，轉到插件>添加新
3. 點擊上傳插件
4. 從您的計算機中選擇壓縮文件
5. 點擊立即安裝
6. 看到“插件安裝成功”，點擊激活插件
7. 轉到“工具” >“ Divi Ribbon 插件許可證”並輸入您的許可證密鑰

Divi 色帶模塊

Divi Builder 中添加了一個名為 Divi Ribbon 的新模塊。 該模塊創建一個簡介（包括標題、內容、圖標、圖像和按鈕）並在該簡介上放置一條絲帶。 您可以控制功能區以及模塊中其他元素的位置和样式。 默認情況下，簡介包括框陰影。

Divi 功能區內容選項卡

內容選項卡包括主要設置、模糊旋轉、圖像和圖標、鏈接、背景和管理標籤。 主要設置提供對功能區類型、位置、文本、標題和內容的選擇。

主要設置

有 7 種色帶類型可供選擇。 它們以相同的方式工作並包含相同的內容，但它們顯示不同的形狀。 形狀包括帶有叉形末端的絲帶、跨越宣傳語的絲帶、側面或頂部的絲帶，並具有不同類型的末端，例如叉形或圓形。 這為您提供了很多顯示選擇。

每種功能區類型都有不同的位置選項，具體取決於它們的顯示能力。 此示例顯示角帶。 它可以放在左上角或右下角，也可以放在左下角或右下角。

分叉可以顯示在左上角或右上角。

可以在上方或下方顯示全寬。

某些功能區類型具有其他選項，可在您選擇它們時打開。 此示例顯示全寬色帶。 您可以調整其位置和高度。

側邊功能區包括對位置、寬度和高度的調整。 所有控件都是標準的 Divi 滑塊，因此易於使用。

標題和內容被添加到卡片本身。 內容區域具有用於視覺和文本的選項卡，它們可以包括媒體、鏈接、代碼和短代碼。

模糊旋轉

模糊旋轉添加了一個 3D 翻轉選項，在卡片翻轉後顯示內容，以及顯示在字體上的圖像和圖標。

添加媒體庫中的圖像和列表中的圖標。 圖像/圖標將首先顯示，然後卡片將翻轉以顯示懸停時的內容。 您還可以添加圖像作為背景。

按鈕

該按鈕包括文本、鏈接、窗口選項、填充和邊距。 我添加了一些左邊距以從功能區下方取出按鈕。

Divi 絲帶設計選項卡

Divi Ribbon Design 選項卡包括圖像和圖標、旋轉、文本、大小、功能區、標題文本、正文、按鈕、間距、邊框、過濾器、變換​​和動畫的設置。

圖像和圖標

圖像和圖標設置允許您調整圖像寬度、邊框、框陰影、顏色、混合模式等。

迴轉

旋轉設置允許您調整面部顏色。 這是圖像背後的背景。 禁用原始卡片邊框，以便您可以創建自己的卡片邊框。 調整旋轉圖標。 它有很多圖標選項。 添加圖標顏色、背景、邊框，並使用預旋轉字體大小。

起初，圖標調整在這里而不是圖像和圖標設置有點令人困惑，但在本節中確實有意義。 將圖像設置也放在這裡也是有意義的，但是有太多它需要一個單獨的選項卡。

文字間距

文本間距為您提供標題和正文文本的邊距和填充設置。 通常，功能區將顯示在內容上。 這使您可以根據功能區的位置調整文本定位（如果您希望它可見）。 在此示例中，我為標題和正文文本添加了填充。

功能區設置

功能區設置允許您更改顏色、添加將填充功能區的圖像、關閉功能區末端（以阻止樣式與卡片重疊）、調整字體、添加文本陰影、調整功能區角和邊框。 在本例中，我更改了色帶顏色。

圖像將填充功能區。 我只能讓 JPG 工作，但效果很好。 我建議選擇一個已經是你想要的大小的圖像，這樣你就可以控制它的顯示方式。

關閉色帶末端可以去除卡片後面向後折疊的部分，如本示例中色帶左側所示。

文本

標題和正文包含所有預期選項。 在此示例中，我增加了兩者的大小，更改了標題文本的顏色，並將兩者居中。

按鈕

按鈕樣式包括所有預期選項，並添加了一項功能以在背景圖像上方顯示漸變。 在這個例子中，我增加了字體的大小，改變了字體和邊框的顏色，使邊框變圓，給背景一個漸變，並添加了一個陰影。

Divi 功能區示例

以下是 Divi Ribbon 在 Divi 佈局中的外觀示例。

在售絲帶

對於第一個示例，我將替換右側的 CTA。

它由三個模塊組成：圖像、文本和按鈕。 我將使用相同的背景、文本和按鈕，並使用單個 Divi Ribbon 模塊重新創建它。

這是使用 Divi Ribbon 的結果。 我添加了圖像、標題文本和正文以匹配原始文本。 我還將功能區添加到角落並將按鈕移動到中心並使用功能區背景中的邊框顏色。 原文使用了列中的圖像。 我刪除了它並將圖像添加到模塊中，但無論哪種方式都可以使用。

我沒有包含波浪形圖像（三角波），但可以輕鬆地將其添加到內容區域中。 標題還需要移動到內容區域，以使圖形顯示在標題上方。 On Sale 絲帶使其更加突出。

最新項目功能區

對於這個，我用 Divi Ribbon 模塊替換了一張圖片，並添加了一個全寬色帶作為 CTA 來查看最新的項目。 功能區具有佈局中的背景圖像和字體。 框陰影是默認設置。 我已將文本居中。

產品 CTA 功能區

對於此示例，我將 Divi Ribbon 模塊添加到皮革公司佈局的商店頁面的英雄部分。 使用佈局中的圖像，我替換了標準的銷售 CTA。 功能區和按鈕使用佈局中的顏色。 我將色帶移到右下角並取下色帶末端。

這是一個專業部分。 我很高興看到它在專業部分運行良好。 許多第三方模塊並不總是與這種類型的部分兼容。

測試和購買

您可以從開發人員的網站上以 11 美元的價格購買 Divi Ribbon Module，用於單個網站上的個人或商業用途。

您還可以在購買前測試插件，看看它是否適合您的需求。 在開發人員的銷售頁面上可以找到測試插件的鏈接。 它使您可以完全訪問 Divi Builder 和插件，因此您可以根據自己的喜好設置樣式。 我建議嘗試一下。

結束的想法

Divi Ribbon Module 是一個有趣的 Divi Builder 模塊。 它包含多個添加圖像的位置，您可以包含標題、內容、圖標和按鈕。 憑藉所有這些功能，它可以很好地用作宣傳語、號召性用語、產品鏈接、博客鏈接等。添加一個可設計的功能區以引起對銷售或其他 CTA 的關注，並且此插件提供了難以實現的樣式選項獲取單個模塊。

Divi Ribbon Module 適用於 Visual Builder 和 Theme Builder。 這是一個很好的插件，很容易推薦。

我們希望聽到您的意見。 您是否嘗試過 Divi Ribbon Module？ 請在評論中告訴我們您的體驗。

精選圖片來自 Foxys Graphic/shutterstock.com