Divi 插件亮点：Divi Carousel 模块

DIVI Carousel Module 是 Divi 和 Extra 的第三方插件，它为 Divi Builder 添加了高级轮播滑块。 您可以控制模块中的几乎所有内容，为您的 Divi 或 Extra 网站创建几乎任何类型的轮播。 在本文中，我们将看看 Divi Carousel Module，看看它可以做什么以及它是多么容易使用。

Divi Carousel 模块安装和激活

正常上传并激活插件。 仪表板中添加了一个名为 DiviGear 的新菜单项。 进入此菜单并添加您的许可证密钥。

Divi Builder 中的 Divi Carousel 模块

Divi Builder 中添加了一个名为 Divi Carousel 的新模块。

该模块包括一个用于添加新项目的区域。 “内容”选项卡具有滑块设置，可让您根据用户使用的设备选择要显示的幻灯片数量、启用多幻灯片、设置过渡持续时间等。启用中心幻灯片、循环、自动播放、箭头导航和点导航. 设置项目间距，启用等高和垂直对齐。 高级设置让您选择滑块效果。

“设计”选项卡包括叠加层、图像（宽度）、图像边框、标题和正文文本、颜色、间距和边框的设置。 这包括箭头和点导航的颜色自定义。

高级选项卡包含您期望的所有 CSS 字段，以及可见性和过渡设置。 它为标题、内容、图像和按钮添加 CSS 字段。

轮播项目设置还包括三个选项卡。 这些设置会覆盖主模块设置中的任何设置。 内容选项卡有一个区域，用于显示主要内容、标题和图像链接、按钮设置、图像设置和背景。

“设计”选项卡包括标题文本、内容样式（正文）、按钮、间距和框阴影的设置。 这些是您在大多数 Divi 模块中看到的标准设计设置。 高级选项卡是大多数模块中的基本设置。

对于图像设置，您可以使用图像或图标。

根据需要添加任意数量的幻灯片。 幻灯片根据您设置的显示数量并排显示。 这一项设置为显示四项。 当然，您可以按您想要的任何顺序拖放它们。

在本例中，我将项目间距调整为 100。在我的示例中显示的主要区别是文本。 现在每行显示更少的单词。

这个使用箭头导航。 我已将其设置为显示在幻灯片的外侧。 我已经将项目间距设置为 1。如果您使用背景颜色，它会更明显。

我已将其设置为显示两张幻灯片。 它显示点导航。

下面来看看高级设置。 我已将滑块效果设置为 Coverflow。 这将打开一个旋转和一个阴影选项。 此功能显示了模块与标准滑块的真正区别。 这是默认设置。

现在我将旋转设置为 100。幻灯片向左侧倾斜更多 3D，远离屏幕。

这是相同的旋转，但没有 Coverflow 阴影。

Divi Carousel 模块示例

我最喜欢的旋转木马用途之一是显示客户或产品的标志。 在这个例子中，我将模块添加到 App Developer Landing Page 的投资组合页面。 我已将其设置为显示 3 个公司徽标、循环滚动和自动播放，因此访问者无需浏览它们。

它还可以显示您参与过的项目。 对于这个，我添加了几个带有按钮的项目，以便访问者可以看到该项目。 我已将按钮的文本颜色更改为白色，并为按钮添加了框阴影。 我将箭头设为白色并将其背景的不透明度设置为几乎透明。

在这里，我为幻灯片添加了背景，使其半透明，并添加了框阴影。 间距包括按钮、图像和内容填充。 我已经为按钮和图像添加了间距。

这个使用溢出滑块效果。 这是默认设置。

对于这一点，我已将其设置为使幻灯片居中。 当与溢出设置一起使用时，它使中间幻灯片居中并使两侧的幻灯片倾斜以面对彼此。 它设置为显示四张幻灯片。

这个设置为显示 3 张幻灯片。 我已将旋转设置为 80。

这个设置为显示 6 张幻灯片。 旋转设置为默认值 (50)。

这一张显示了 6 张没有启用中心幻灯片或溢出的幻灯片。

这个显示了 6 启用了中心幻灯片。

在本示例中，我将该模块用作食物菜单滑块。 通过添加图像、文本和按钮，它实际上创建了一个模糊的滑块。 图像设置为 100 宽度。 我添加了一个叠加层、一个购买每件商品的按钮（该按钮会将您带到该商品的产品页面）和点导航。 我已经设计了覆盖层和覆盖层图标以及活动和非活动幻灯片的点。 它非常适合咖啡布局。

对于这一点，我添加了箭头导航并对其进行了样式设置以匹配按钮。 我让它在悬停时显示箭头。 您可以在滑块内部或外部设置箭头并更改其颜色。 您无法在模块的设置中更改它们的大小。

这个使用了 Coverflow 效果。 我将鼠标悬停在左侧幻灯片上以显示叠加层和箭头。

对于这个，我只在其中一张幻灯片中添加了背景和框阴影。 这可用于显示正在出售的商品或突出显示最优惠的价格。

对于这个，我只使用图标。 我将该模块放在一组简介模块旁边，并设置了 6 个社交媒体链接。 它们的样式与宣传语相匹配。 单击该图标可打开社交网络。 我已将其设置为每秒自动滑动一次。

显示多张幻灯片会切断图标的一部分，这在滑块动画时提供了良好的视觉效果。

对于这个例子，我想构建一个简单的定价表滑块。 我简化了高尔夫球场布局包中的价格。

现在我添加了框阴影。 起初，我无法让垂直阴影进入幻灯片下方。 然后我意识到幻灯片正在接触模块容器的侧面。 我添加了模块填充，然后我可以在幻灯片的所有侧面添加框阴影。

您还可以单独调整每张幻灯片的按钮、图像和内容填充。 在此示例中，我正在调整左侧幻灯片的填充。

我添加了箭头并设置了它们的样式以匹配布局中的元素。

在这个例子中，我添加了图像，更改了框阴影，并添加了更多的内容填充，以便框阴影完全显示。 我还将箭头移到幻灯片的外部。

现在我添加了一个按钮。 我调整了按钮样式，包括颜色、边框半径、文本大小，并添加了与幻灯片匹配的框阴影。

当然，由于该模块包含一个内容区域，您可以添加您想要的任何类型的内容，包括媒体。 我添加了与布局匹配的图像。 所有内容都放在标题下。 图像在这个位置看起来很棒。

以下是模块在高尔夫球场布局中的外观。 原始布局具有许多定价功能。 使用 Divi Carousel Module，所有定价仍然存在，但显示在幻灯片中。 看起来它属于这种布局。

它也适用于 Extra。 在此示例中，我已将页面设置为不显示侧边栏。

这是侧边栏的外观（虽然我没有为侧边栏添加任何小部件，但大小是相同的）。 您可以在此处看到该模块具有响应性。

Divi Carousel 模块价格

Divi Carousel Module 可从开发人员的网站获得。 有两种选择：

• 单个站点 – 15 美元
• 无限站点 – 29 美元

Divi Carousel 模块文档和支持

DiviGear 仪表板菜单中提供了文档。 选择文档选项卡。 这提供了指向 DiviGear YouTube 频道上 4 分钟视频演练的链接。 通过 Freshdesk 提供票证支持。

结束的想法

Divi 轮播模块是一种向 Divi Builder 添加轮播滑块的简单方法。 它很直观，实际上比我预期的有更多的自定义。 有几次我无法正确克隆幻灯片，但这可能是我的问题。 记住给每张幻灯片一个管理标签，否则它们会在模块中显示项目的名称，这使得很难区分它们。

我喜欢它分别有图像、内容和按钮。 这允许您创建卡片、简介、图像、文本、显示图标或任何您需要在滑块中显示的内容。 您可以将图像添加到滑块的顶部，并且仍然可以向内容区域添加更多图像。

Divi Carousel Module 是一款出色的旋转木马滑块。 它可以从开发者的网站和 Divi 市场获得。

我们希望听到您的意见。 您是否尝试过 Divi Carousel 模块？ 请在下面的评论中告诉我们您对此的看法。

精选图片来自 Anatolir/shutterstock.com