Divi 插件亮点:Divi Icons Pro
已发表: 2019-04-05Divi Icons Pro 是一个第三方插件,它为 Divi Builder 添加了 2500 多个图标和一些相关功能。 它带有多个购买选项,甚至包括一个带有超过三百个自定义图标的免费选项。 在这个 Divi 插件亮点中,我将看看插件的专业版,看看它可以做什么。
关于 Divi Icons Pro

Divi Icons Pro 为 Divi 添加了许多新的图标功能,包括:
- 超过 2500 个新图标
- 360 度自定义线条样式图标
- 1295 个 Font Awesome 图标,分别有 74 个类别和 4 种样式
- 900 个 Material Design 图标,分为 16 种类别和 5 种风格
- Divi Builder 集成
- Divi 模块中的图标搜索功能
- Divi 模块中的图标过滤器可按系列选择或键入图标名称
这些图标集成到 Divi 构建器中,并与 Divi 的本机图标一样工作,因此您可以使用任何使用图标的 Divi 模块来设置它们的样式。 就像 Divi 构建器中的任何图标一样,您可以自定义颜色和大小,使用模块控件设置它的显示位置,并添加圆形或边框。
Divi Icons Pro 安装

解压下载文件。 在里面,你会找到插件和说明。 正常上传并激活插件。

通过转到仪表板菜单中的设置> Divi Icons PRO 激活来激活 API 密钥。 您现在可以使用插件的专业版。 图标会自动集成到 Divi Builder 中,因此除非您想自定义主题选项中的默认设置,否则您无需执行任何其他操作。
Divi Icons Pro Divi 主题选项

默认情况下启用图标,但您可以启用或禁用所需的图标系列,并选择将它们加载到网站的方式。 Divi 主题选项中添加了一个新的 Divi Icons Pro 选项卡。 在这里,您可以选择要使用的图标系列。 您还可以选择从 CDN 加载 Font Awesome 和 Google Material Icon 字体。
Divi Icons Pro 图标

图标、过滤器和搜索功能会自动添加到使用图标的 Divi 模块中。 这是三个简介模块,显示了 Line Style Icons、Font Awesome 和 Material Design Icons 中的一个图标。
Divi Icons Pro 搜索

搜索功能让您可以使用直观的词来查找您的图标。 您不需要知道图标的名称。 只需输入您要搜索的关键字,图标就会出现在图标选择区域。 如果需要,您可以通过在过滤器中选择品牌来按品牌缩小搜索范围。 有些图标没有出现在搜索结果中,所以搜索并不完美,但效果很好。 Font Awesome 和 Material Icons 中的某些图标可能命名不当。
Divi Icons Pro 过滤器

您可以过滤图标或查看所有图标。 过滤器显示来自该特定品牌或系列的图标。 要查看特定品牌,只需单击带有您要查看的品牌标签的按钮即可。 它将过滤掉所有其他图标。 此示例显示了优雅主题图标的一小部分示例。

这是线条样式图标的示例。 它们比其他图标更薄,因此它们本身往往能更好地工作。 我确实与其他人一起尝试过,并且在某些情况下他们确实一起工作。 值得尝试看看什么对你有用。 图标设计得很好,是我最喜欢的品牌之一。

这是 Font Awesome 图标的一小部分示例。

这是 Material Design 图标的一小部分示例。
Divi Icons Pro 示例

在这个例子中,我用线型图标替换了度假村布局中的图像。 我将它们设置为蓝色并将大小更改为 48 像素。 图标在布局中看起来很棒。

在这个中,我已将图标位置从顶部更改为左侧。 我还将大小更改为 30 像素,并添加了 50 像素的填充以将每个简介居中。


在这个例子中,我用宣传语替换了页脚中的社交媒体模块,这样我就可以选择我自己的图标并设置它们的样式。 所有这些都来自Font Awesome。 我已将颜色设置为与网络的品牌相匹配,将大小更改为 52 像素,并在右侧添加了 30 像素的填充以使它们居中。

这一次,我将图标更改为白色,并将背景设为品牌颜色。 我添加了一个框阴影并添加了一些填充以使图标居中。 我还为橙色按钮添加了填充以加宽它,使其与社交图标的宽度相匹配。 图标与布局的设计很好地融合在一起。

这个使用家居装修布局。 我已经用宣传语和使用不同字体系列的图标组合替换了图像。 它们设置为显示在简介的左侧。 图标是 50px。 你可以在这个例子中看到,我在 Font Awesome 图标中搜索了“paint”。

这些已经是带有图标的简介,所以我只是选择了它们,搜索了相同的主题,然后选择了不同的图标。

这个为图标添加了一个圆圈。 我已将圆圈设为白色以匹配布局的背景并使圆圈的颜色与图标匹配。

这些图标与按钮一起使用,但它们不会显示在 Visual Builder 中。 它们在实际网站上确实工作得很好。

这是布局内按钮中的图标。 它工作得很好。

这是一个近距离视图,以便您可以看到它在按钮中的外观。

在这个例子中,我用 Paralegal 布局中的简介替换了图像。 我搜索了与主题匹配的图标,除了金钱图标外,我使用了原始图形中的颜色。

在这个例子中,我用图标替换了 Butcher 布局中的图像。 我使用了标题文本中的红色并将图标字体大小设置为 84px。

我为每个简介添加了背景颜色和框阴影。 它在布局中看起来很棒。 我将鼠标悬停在中心的模糊上以显示其悬停效果。 它高于其他内容,包括图标在内的内容向右移动。
Divi Icons Pro 价格

根据您希望与插件一起使用的站点数量,有多种购买选项。 它们包括 6 个月的支持和终身更新。 您可以从开发者网站购买 Divi Icon Pro。
- 常规许可证(1 个站点)– €25.00
- 扩展许可证(无限站点)– €65.00
还有一个免费版本,其中包含 360 线样式图标。 它不包括支持或更新。
Divi Icon Pro 文档

文档包含在下载文件中,但您也可以在线访问。 该文档很详细,并指导您安装插件和使用图标和功能。 它还包括常见问题解答和获取支持的链接。 链接包括社交媒体上的 Divi 社区和您的帐户,其中包含创建支持票的链接。
结束的想法
图标插件是将新图标添加到 Divi Builder 的最简单方法,而 Divi Icons Pro 也非常简单。 它包含大量图标,您可以启用或禁用特定品牌的图标以更好地控制模块中显示的内容。 我喜欢过滤器和搜索功能。 我能够为我处理的每个主题找到一个图标。
我遇到的唯一问题是在使用 Visual Builder 时图标不想显示在按钮中,但它在 Classic Builder 中运行良好,并且它们在网站上显示得很好。 有些图标没有出现在搜索结果中,但我认为这更多是图标开发人员如何命名图标的问题。 这些问题很小,不会阻止我使用或推荐该插件。
Divi Icons Pro 易于使用,几乎毫不费力地添加了大量新图标。 如果您有兴趣向 Divi 构建器添加更多图标,请查看 Divi Icons Pro。
我们希望听到您的意见。 您是否尝试过 Divi Icon Pro? 请在评论中告诉我们您对此的看法。
特色图片来自 VectorsMarket/shutterstock.com
