Divi 插件亮点：Divi Next Blurb

Divi Next Blurb 是一个第三方简介模块，它添加了多项功能来创建独特的简介设计。 该模块同时显示图标和图像，让您几乎可以独立自定义每个元素，甚至为大多数元素添加了许多悬停效果。 在本文中，我们将看看 Divi Next Blurb 并看看它可以做什么。

Divi Next Blurb 模块

上传并激活 Divi Next Blurb 后，会向 Divi Builder 添加一个名为 Next Blurb 的新模块。 您无需进行任何设置。 它可以使用了。

Divi Next Blurb 内容选项卡

内容选项卡包括文本设置，允许您启用前置标题文本、输入文本、选择标题标签以及启用帖子标题文本。 您还可以添加内容。

前标题将文本置于标题上方，而后标题将文本置于标题下方。 您可以更改每个的标题标签。

同时或独立添加图像和图标。 标准的 Divi 简介模块仅显示其中之一。 Divi Next Blurb 允许您同时显示两者，从而开辟了许多设计可能性。

包括一个具有标准按钮样式的按钮。

它还包括许多用于标题、描述、图像、图标和按钮的背景颜色选项。 您可以独立启用和调整它们。 为每个选择一种颜色或渐变。

Divi Next Blurb 设计选项卡

“设计”选项卡包括图像、图标、悬停效果、标题和描述文本以及按钮文本、图标和悬停效果的设置。 大多数元素还有用于间距、边框和框阴影的单独部分。 有很多调整来设计你的简介。

下一个模糊图像

图像设置可让您选择图像位置并调整边框。 本示例将图像放置在左下角。

这一个将图像放在右中心。 我添加了一个边框并改变了它的颜色。 我还添加了一个框阴影。

在这个例子中，我将图像放在底部中心。 我去掉了边框并把角弄圆了。 这个有一个不同的盒子阴影。

该图标还包括放置选项。 您还可以调整大小、颜色、边框等。在本示例中，我将图标放置在右下角。

下一个模糊图标

此示例显示左侧中心的图标。 我增加了尺寸，添加了边框，并更改了边框的颜色。

此示例显示顶部中心的图标。 我缩小了尺寸，添加了一个框阴影，并圆角到角落以创建一个圆圈。

下一个模糊悬停效果

悬停效果包括 2D 和倾斜选项。 2D 选项提供 16 种效果可供选择。

此示例显示了脉冲悬停效果。

倾斜效果包括眩光选项、反向选项、透视、速度、起点和终点等。此示例显示启用眩光的标准倾斜选项。 我保留了默认设置。

这个例子增加了更多的眩光和透视。 有很多方法可以自定义倾斜度。

下一个模糊文本

标题文本具有前文、标题和后文的设置。 它们包括您期望的所有文本设置。 在这个例子中，我已经调整了所有三组文本。

描述文本包括所有标准文本设置，包括对文本、链接、项目符号、引号等的调整。在本示例中，我增加了字体大小，将其更改为红色，并添加了阴影效果。

下一个模糊按钮

包括所有标准按钮文本和图标调整。 我增加了字体大小并更改了颜色。 此示例显示按钮图标设置。

按钮悬停包括许多调整，包括 2D、背景、笔触和图标。 2D 设置包括许多悬停效果。

按钮悬停包括许多调整，包括 2D、背景、笔触和图标。 2D 设置有很多悬停效果。 背景效果包括另一组效果。 这显示了悬停按钮。

Stroke 添加了背景和边框调整以及几种悬停效果。 此示例在内部添加边框并更改颜色。

Icon 还添加了很多悬停效果，这些效果只会影响悬停时的图标。

Divi Next Blurb 示例一

例如，我想用 Next Blurb 模块替换 Leather Company 布局右侧的 Sale 文本并添加一些功能。

它通常由一个文本模块和一个按钮组成，正如您在线框视图中看到的那样。 黑色背景被添加到列中。

这是仅使用 Next Blurb 模块重新创建的 Sale 号召性用语。 在这个例子中，我仍然使用黑色背景作为列。

这是线框视图。 该模块与专业部分配合得很好。

我现在可以添加原始布局中的图像和按钮无法获得的效果和功能。 例如，我添加了 Grow Rotate 2D 悬停效果。 由于我将标题文本和按钮放置在该列空间的黑色背景上，当内容倾斜时，卡片似乎保持原位。

这包括倾斜效应。 我添加了眩光，以便在悬停时可以在背景中看到卡片。

对于此示例，我已将图像添加到简介中。 我把它留在了简介卡的顶部。

对于这个，我添加了流行悬停效果，只是为了显示动画。 这是吸引访客注意力的好方法，因为他们将鼠标悬停在宣传栏上。

这包括没有启用眩光的倾斜效果。 卡片在列内倾斜，但卡片的边界不像感知的那样。

我已经从列中删除了背景并将其添加到模块中。 这将保留文本后面的黑色背景。 我还为图像添加了一个框阴影。 我删除了边框，所以当我使用倾斜效果时，边框不显示。

这是倾斜效果的外观。 它在为图像添加透视方面做得很好。 我喜欢盒子阴影的外观。

Divi Next Blurb 示例二

在这个例子中，我想用 Next Blurb 模块替换 Startup 主页布局中的简介，并使它们的设计更复杂一些。

使用当前设置重新创建简介很容易。 我在这里所做的只是添加图像、标题和内容。 现在，我会做一些调整。

我将图像移到左上角，并为图像和正文添加了框阴影。 边框的角是圆角的，正文文本的顶部和底部现在有 5 个像素的填充。

对于这个，我将图标放在右中心并调整图像间距以使其与标题文本对齐。 我已将文本设为白色，并将正文的背景设为原始文本颜色。 对于标题文本，我已将背景设为渐变。

这是结果。 我在标题文本的顶部添加了填充，将所有文本居中，并添加了一个带有底部边框的按钮。 我已将图像添加到底部中心并增加了它们的大小。 图像在顶部包含一些填充，以在它们和内容区域之间添加一些空间。 按钮有一个很明显的框阴影。 我隐藏了顶部和侧面边框，所以只显示底部边框。 对于悬停效果，我添加了 3D 倾斜。

以下是布局中 Next Blurbs 的外观。

Divi Next Blurb 价格和购买地点

Divi Next Blurb 具有三个可用许可证：

• 单一许可证 – $25.00
• 无限许可 – $49.00
• 终身许可证 – $99.00

您可以从开发商的网站上购买。

结束的想法

Divi Next Blurb 是一个有趣的 Divi 模块。 我只是触及了它可以做什么以及可以用它设计什么的表面。 它的设置和调整比我预期的要多得多。 几乎每个元素都有自己的边框、间距和框阴影设置。

有一些功能似乎可以放置在更标准的区域中。 例如，标题标签选择器位于内容选项卡而不是设计选项卡中。 弄清楚东西在哪里仍然很容易，而且我很容易理解任何设置的作用。

我非常喜欢 Divi Next Blurb。 如果您对比标准 Divi 模块功能强大得多的易于使用的模糊模块感兴趣，Divi Next Blurb 值得一看。

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

精选图片来自 Leonid Zarubin/shutterstock.com