Divi 插件亮点：终极 Divi Builder 插件
已发表: 2019-04-13Divi Builder Addons 是一个第三方插件，在Divi Builder中添加了很多高端网站使用的jQuery脚本。 只需切换您想要的脚本并将 CSS 类添加到 Divi Builder 模块。 它易于使用，包括许多功能和动画。
Ultimate Divi Builder 插件菜单
正常上传并激活插件。 仪表板菜单中添加了一个名为 Ultimate Divi Builder Addons 的新菜单项。 单击此按钮会在左侧窗口中打开一个包含许多功能的屏幕。 单击其中任何一个会在右侧窗口中显示切换和信息。 右侧窗口还包括一些效果的 CSS 类并展示如何使用它们。 其他包括用于更多功能和选项（如颜色、图像大小、持续时间等）的多个切换。默认情况下，它们都处于禁用状态。
显示为紫色的功能处于启用状态，而显示为灰色的功能则处于禁用状态。 在上面的示例中，该功能包括其他选项以及 CSS 类。 单击某个特定功能所需的所有信息都会显示在右侧窗口中。
功能包括：
- 自定义滚动条
- DoSlide 水平
- 淡入视野
- 翻转文本
- 向下滚动时隐藏 Divi 主题标题
- jQuery 翻页垂直滚动
- jQuery Pageflipping 水平滚动
- jQuery 滚动流
- jQuery 滚动效果
- jQuery 滚动触发器
- jQuery 结束页面框
- 滚动 Effect1 时加载标题
- 滚动 Effect2 时加载标题
- 滚动 Effect3 时加载标题
- 滚动 Effect4 时加载标题
- 启示者动画
- ScrollMagic 响应持续时间
- 滚动显示
- StickyStack：jQuery 堆叠效果
- 滚动窗口
- 超级简单的文本旋转器/自动收报机
- 哇动画
Ultimate Divi Builder 插件示例
以下是与 Divi 布局一起使用时的一些功能示例。
自定义滚动条
自定义滚动条可让您在内容上放置滚动条。 它有8种不同的效果。 将 CSS 类粘贴到要使用效果的部分、行或模块的 CSS 类字段中。 在这个中，我在电子竞技布局中为文本模块的内容添加了自定义滚动条效果。
现在悬停时会出现滚动条，因此我可以滚动以查看同一空间中的更多内容。 这是效果1。它在现场网站上有不同的设计。 我已经照亮了背景，所以它脱颖而出。
这是效果 3。它在幻灯片的顶部和底部添加了箭头。
效果 5 将手柄从线更改为点并更改箭头的样式。
翻转文本
翻转文本是一种文本输入效果，可创建滴答作响的介绍动画。 它有5种效果。 对于此示例，我将翻转文本添加到律师助理布局。 这是第一个翻转文本打字效果。 它一次键入一个字母。 您可以使用多种不同的类。 每一种都以不同的速度打字。
jQuery 滚动流
jQuery Scroll Flow 向行或模块添加滚动动画。 它有5个动画。 我已将此添加到律师助理布局的一行中，以便它同时影响所有模块。 您还可以将它添加到行中的一个模块中，以便它滑动到位以适应已经存在的其余内容。
当我滚动到该行时，内容开始显示。 它比正常情况小，并且不透明度设置得足够低以允许背景显示出来。
再滚动一点会增加内容的大小和不透明度，直到它以全宽和不透明度显示出来。 当我向上滚动时，它再次减少。 这个保持在相同的位置，但它有几个其他类，因此您可以在调整其大小和不透明度的同时使其从右侧、左侧或上下滑动。
jQuery 滚动效果
jQuery ScrollFX 缩放文本并更改背景不透明度。 scrollfx 类已添加到该部分。 此部分中的模块在您滚动到它们以及它们在屏幕上时正常显示。
当您滚动浏览它们时，该部分的内容会缩小，并且它们的不透明度也会降低。
jQuery 滚动触发器
jQuery 滚动触发器在页面滚动时滑动模块。 将滚动触发器类添加到该部分。 这是度假村的布局。 添加类时，背景图像会自动移到一边。
当您到达该部分时，所有内容（包括图像、按钮、文本等）都会滑动到位。
然后一旦一切就绪，它就会安定下来。
jQuery 结束页面框
jQuery End Page Box 在屏幕底部放置一个框。 它是通过将代码添加到节末尾的文本模块来创建的。
这会添加一个出现在屏幕底部的框，并更改为显示您为每个部分指定的不同内容。
这是下一节。 盒子从不同的方向滑出和滑入，或者每个部分都有不同的动画。
滚动时加载标题
滚动时加载页眉向菜单中添加一个栏，显示您已看过多少页面。 它不需要 CSS 类。 您可以自定义滚动条的颜色。 有四种款式可供选择。
这是效果 1。它在屏幕顶部添加了一条滚动线。 当您滚动时，它的大小会增加，显示访问者看到了多少页面。
这是效果 2。它显示一个更宽的条。
这是效果 3。当您滚动时，它会垂直增长，占据徽标的高度。 它不会变得很大，但它仍然显示滚动效果。
效果 4 占用徽标的宽度。
启示者
Revealator 将滚动触发的动画添加到部分、行或模块。 它有近 40 个选项。 我正在添加面包店布局中的简介。 在它的容器在屏幕上完全可见之前，blurb 会丢失。
它根据您选择的类在屏幕上动画。 这个有很多动画选项，包括淡入淡出、向左旋转、向右旋转、向左滑动、向右滑动、向上滑动、向下滑动、放大和缩小。
滚动魔术部分湿巾
Scroll Magic Section Wipes 创建一个动画，在您滚动时将内容擦除到屏幕上。 我认为这是所有效果中我最喜欢的。 它已添加到该部分。
一旦该部分完全显示在屏幕上，它就会冻结在原地，下一部分会滚动到它上面。 您可以将它添加到尽可能多的部分，为整个页面创建一个有趣的滚动方法。 如果您希望每个部分都重叠，那么您会对 StickyStack 功能感兴趣。
滚动显示
Scroll Reveal 在滚动时显示模块。 从 17 种不同的动画中进行选择。 您可以将其添加到部分、行或模块。 底部的部分在滚动时朝着读者缩放。
这是效果1f。 当您滚动到该行时，该行会旋转到位。
StickyStack：jQuery 堆叠效果
StickyStack：jQuery Stacking Effect 在面板到达视口顶部时堆叠面板。 换句话说，当您滚动时，每个部分都会在屏幕上冻结，而下一部分会滚动以重叠它。 结果在滚动上看起来很棒。 这是风险管理布局。
这是同一页面的另一部分。 重叠部分完美地工作。
超级简单的文本旋转器/自动收报机
Super Simple Text Rotator/Ticker 可让您向文本添加标记并旋转多个单词。 它有5种动画风格。 这个在简单和可定制这两个词之间旋转。
在这里，它被旋转以显示第二个单词。 两个词都淡入淡出。
Ultimate Divi Builder 插件价格
Ultimate Divi Builder Addons 为 59 美元，可在无限网站上使用，包括终身更新。 更新通常会添加新功能。 您可以免费试用一个演示，看看您是否喜欢它。
- 您可以从 DiviBuilderAddons.com 购买 Ultimate Divi Builder Addons。
结束的想法
Ultimate Divi Builder Addons 提供了很多功能，可以节省大量开发功能和动画的时间。 所包含的功能数量以及它们的易用性给我留下了深刻的印象。
如果没有用大 GIF 填充这篇文章，有些更难以展示。 例如，Wow Animation 有 75 个动画可供选择，您可以更改延迟、持续时间、距离和重复次数。
该插件确实要求您能够轻松地将 CSS 类粘贴到部分、行或模块中。 幸运的是，这很容易做到，Divi 文档中有大量关于粘贴 CSS 类的信息。
如果您对向 Divi 添加大量功能和动画的简单方法感兴趣，Ultimate Divi Builder Addons 值得一试。
我们希望听到您的意见。 您是否尝试过 Ultimate Divi Builder 插件？ 请在评论中告诉我们您对此的看法。
精选图片来自 GoodStudio/shutterstock.com