Divi Toolbox是一个插件 它为 Divi 添加了许多通常需要 CSS、JavaScript、PHP 或许多单独插件的新效果。 这些效果易于使用、自定义并为您提供 网站Web 赋予额外的光芒,从人群中脱颖而出。

效果包括网站范围的更改,新的移动菜单,粒子背景,页脚,小部件,样式,动画,标题,导航,新的博客布局,在新位置进行Divi演示,自定义登录屏幕,弹出窗口等。 可以通过在主题定制器中添加新功能来定制许多功能。 Divi Toolbox不适用于Extra或Divi Builder插件。

Divi Toolbox的常规设置

divi工具箱settings.png

Divi Toolbox选项屏幕已添加到Divi仪表板菜单。 此处启用了设置,但在定制程序中进行了调整。

设定 一般 包括全局标题样式,自定义登录页面,隐藏项目,上传SVG文件类型的权限,自定义浏览器滚动条,404页面设置(选择布局和隐藏)页眉和页脚)和社交图标(激活样式,打开文件)。 新标签并添加更多图标)。

divi toolbox general parameters.png

添加社交图标会打开一个字段,您可以在其中输入9个其他社交网络的URL。

添加社交网络divi.png

这是标签 一般 定制程序的位置,在这里我可以调整已启用的设置。 设置包括标题和字体,浏览器滚动条和登录屏幕。 在此示例中,我对h1文本和正文进行了一些调整,并在滚动条中添加了样式。 我还添加了更多社交图标。

divi toolbox customization settings.png

对于登录屏幕,您需要进行更改,然后注销或在其他浏览器中查看该屏幕。

自定义登录屏幕divi.png

这是添加背景图片,徽标并更改字段和文本的大小和颜色后的登录屏幕。 进行一些调整是因为在进行更改时看不到屏幕。

Divi Toolbox标头设置

标头设置divi.png

设定  向菜单添加样式,激活自定义下拉菜单,添加CTA菜单按钮,更改泊坞窗上的徽标,激活覆盖徽标并在浏览主页之前添加Divi布局,以及'之前和之后的格式。 浏览其他页面。

工具栏配置divi.png

CTA菜单按钮可让您将CTA应用于第一个或最后一个菜单项或应用自定义类。 它提供了CSS以及添加位置的说明。

divi.png标头定制器

这是标题的定制程序。 我在菜单上方添加了一个布局(在此示例中,它只是一个文本模块,但是您可以根据需要添加完整的布局)。 重叠的徽标有一个带有阴影效果的方框。 我将徽标大小从200更改为140,并将社交图标移至主菜单。 我将鼠标悬停在“服务”菜单项上,以便可以看到CSS效果。

Divi工具箱中的页脚设置

页脚设置divi.png

页脚设置包括粘性页脚,显示页脚,自定义菜单和小部件,自定义“返回页首”按钮(添加自定义按钮链接选项)以及在布局之前和之后添加页脚。

自定义页脚divi.png

在此示例中,我将标题和菜单字体更改为全部大写,并增加了间距。 我还调整了悬停颜色,并在悬停文本旁边添加了一个图标。 我在布局之后添加了布局。 这使用了显式的页脚(这就是为什么文本位于上面的文本模块后面的原因)。

我设置页面顶部按钮的样式以显示文本。 它具有阴影效果,我调整了它的位置。 我保留了默认颜色。 我将底部文本和社交图标居中。 对于悬停效果,我选择了“增长”(它还包括收缩,上移,下移,摆动,心跳,果冻和脉搏)。

Divi Toolbox Mobile的设置

mobile.png的工具箱设置

设定 移动 包括一个用于输入移动菜单断点的字段(菜单从桌面更改为移动菜单时屏幕的确切宽度),自定义样式,编辑徽标,选择汉堡包图标点击效果,折叠嵌套子菜单并激活。 几个CSS类。 CSS类允许您反转列并居中显示文本,模块和按钮。

Divi-Toolbox-Mobile-Settings-for mobile.png

这是页面的预览 谷歌 Chrome 选择了“响应式”。 一旦我将屏幕尺寸设置为低于 980 像素,它就会更改为我选择的移动图标,并添加带有我选择的动画的汉堡菜单。

mobile menu animation.png

在此屏幕中,我正在设置背景色,悬停背景色和移动菜单汉堡菜单的样式。 我将主菜单项的文本更改为大写,并保留了CTA文本标准。 我还更改了CTA菜单项的背景。 您还可以调整菜单和图标大小。

博客设置Divi工具箱

博客设置divi toolbox.png

参数 新闻 允许您自定义侧边栏和小部件,发布元,存档和类别页面,选择布局(从6个选项中选择),隐藏存档侧边栏和自定义按钮文本阅读更多。

对于单个帖子,您可以选择侧边栏布局、隐藏帖子标题、添加作者框、添加上一个和下一个链接、添加相关帖子和自定义 形式 评论。 您还可以将自定义后导航布局添加到单个帖子、档案、类别、作者页面和搜索结果页面。

自定义博客divi.png的外观

对于博客页面,我向侧边栏添加了阴影效果,更改了字体和样式,为搜索框设置了样式,并增加了边框的大小。 它使用交替的布局,我为“阅读更多”按钮定制了文本。

结果定制界面博客divi.png

此示例为布局6。我再次为meta节自定义了字体颜色,并添加了悬停颜色。 我还为“了解更多”按钮定制了背景。

更改博客内容divi.png的字体

单个博客文章允许您自定义在博客设置中添加的每个项目。 在此屏幕中,我自定义关联的文章,下一个和上一个链接以及作者区域。 您可以控制所有文本,颜色,阴影等。

自定义部分评论divi.png

在这个例子中,我正在定制 形式 评论。 您可以控制字段颜色(焦点和非焦点)、边框、文本、颜色、按钮等。 我更改了按钮的背景颜色、字段的焦点颜色、为字段添加了边框并更改了半径。

Divi工具箱许可证

您可以在两个之间选择 许可证 :

  • 常规许可证(用于项目)-€49,00
  • 扩展许可(用于无限项目)-€169,00

要记住什么

这个插件的功能和设置让我印象深刻。 我特别喜欢这样一个事实,它可以为非使用Divi构建器创建的博客文章添加相似的文章,上一个和下一个链接以及一个作者区域。 滚动条也很不错。

您可以在Divi模块中访问一些设置,例如标题文本,但是它提供了这些设置的更多详细信息。 我想添加一些其他调整(例如,评论区域的阴影效果,更多徽标选项,社交媒体图标位置等)。

如果您想以最简单的方式向Divi中添加大量新效果,那么绕开Divi工具箱是值得的。