Divi Plugin Highlight: Divi Toolbox

Posted on November 11, 2018 by in Divi Resources | 40 comments

Divi Plugin Highlight: Divi Toolbox

that adds a lot of new effects to Divi that would normally require CSS, JavaScript, PHP, or lots of individual plugins. The effects are easy to use and customize and give your Divi website some extra sparkle to stand out from the crowd.

Effects include site-wide changes, new mobile menus, particle backgrounds, footers, widgets, styling, animations, headers, navigation, new blog layouts, Divi layouts in new locations, login screen customization, popups, and lots more. Many of the features can be styled with new additions to the theme customizer. Divi Toolbox does not work with Extra or the Divi Builder plugin.

Divi Toolbox General Settings

The Divi Toolbox option screen is added to the Divi dashboard menu. Settings are enabled here, but the adjustments are made in the customizer.

The General settings includes global headings style, customize login page, hide projects, allow SVG file type uploads, custom browser scrollbar, 404 page settings (choose a layout and hide the header and footer), and social icons settings (enable styling, open in a new tab, and add more icons).

Adding more social icons opens a field where you can enter the URL for 9 more social networks.

Here’s the General tab in the customizer, where I can adjust the settings that I enabled. Settings include headings and fonts, the browser scrollbar, and the login screen. In this example, I’ve made a few adjustments to the h1 and body text and added styling to the scrollbar. I’ve also added more social icons.

For the login screen, you’ll have to make your changes and then log out or view the screen in another browser.

Here’s my login screen after adding a background image, logo, and changing the size and colors of the fields and the text. It does take a little tweaking since you can’t see the screen as you make your changes.

Divi Toolbox Header Settings

The Header settings add styling to the menu, enable a custom dropdown menu, add a CTA menu button, change the logo on fixed menu, enable overlapping logo, and add a Divi layout before navigation on the home page, and a layout before and after navigation on other pages.

The CTA menu button lets you apply the CTA to the first or last menu item, or apply a custom class. It provides the CSS and instructions on where to add it.

Here’s customizer for the header. I’ve added a layout above the menu (in this example it’s just a text module, but you can add a complete layout if you want). The overlapping logo has a square box with shadow effects. I changed the logo size from 200 to 140 and moved the social icons to the main menu. I’m hovering over the Services menu item so you can see the CSS effect.

Divi Toolbox Footer Settings

Footer settings include a sticky footer, footer reveal, customize menus and widgets, customize the back to top button (which adds a custom button link option), and add before and after footer layouts.

In this example, I’ve changed the header and menu fonts to all caps and increased the spacing. I’ve also adjusted the hover colors and added an icon next to the text on hover. I’ve added a layout after the footer layout. This one uses a revealed footer (which is why the text is behind the text module above it).

I’ve styled the back to top button so it displays text. It has a shadow effect and I’ve adjusted its location. I left the colors at default. I’ve centered the bottom text and social icons. For the hover effect I chose Grow (it also includes shrink, move up, move down, wobble, heartbeat, jello, and pulse). I’m hovering over the Facebook icon so you can see the effect.

Divi Toolbox Mobile Settings

The Mobile settings include a field to enter the mobile menu breakpoint (the exact screen width when the menu changes from desktop to mobile), custom styles, change the logo, choose the hamburger icon click effect, collapse the nested sub-menu, and enable several CSS classes. The CSS classes allow you to reverse the columns and center the text, modules, and buttons.

Here’s a look at the page in Google Chrome with Responsive selected. As soon as I took the screen size less than 980 pixels it changed to the mobile icon that I selected and added the hamburger menu with animation that I chose.

In this screen, I’m styling the mobile menu’s background color, hover background color, and hamburger menu. I’ve changed the text for the main menu items to all caps and left the CTA text standard. I also changed the background for the CTA menu item. You can also adjust the menu and icon size.

Divi Toolbox Blog Settings

The Blog settings allow you to customize the sidebar and widgets, the post meta, the archive and category pages, choose a layout (from 6 options), hide the archives sidebar, and customize the read more button text.

For single posts you can choose the sidebar layout, hide the post title, add an author box, add previous and next links, add related posts, and customize the comments form. You can also add custom layouts after navigation to single posts, archives, categories, author pages, and search results pages.

For the blog page, I added a shadow effect to the sidebar, changed the fonts and their styling, and styled the search box and increased the size of the border. It uses an alternating layout and I customized the read more button text.

This example is layout 6. I’ve customized the meta font colors again and added a hover color. I’ve also customized the read more button background.

The individual blog posts let you customize each of the elements that you added in the blog settings. In this screen, I’m customizing the related posts, next and previous links, and the author box. You have control over all of the text, colors, shadows, etc.

In this example, I’m customizing the comments form. You have control over the field’s colors (both focus and non-focus), border, text, colors, button, etc. I’ve changed the button background color, the field’s focus color, added a border to the field, and changed the radius.

Divi Toolbox Modules Settings

The Modules tab provides settings to add a follow-the-mouse hover effect, add a slim email opt-in (it provides CSS for three different options), secondary buttons (which adds a new layer of customization), and lots of tweaks.

The tweaks include an animated triangle icon for accordion and toggle modules, removing the horizontal bottom border and padding for pricing tables, moving the portrait image below the content in testimonials, hide horizontal scrollbars, and adding CSS to vertically align columns and to change the height of any element to 100% of its viewport height.

Here’s a look at the slim email opt-in. It places all of the fields on a single line. This example also uses the secondary button. Only the buttons that I’ve added the CSS class to will get these changes. Using the CSS class means that I now have two global button styles.

Divi Toolbox Extras Settings

The Extras tab includes preloaders, popups, particles background, 3D tilt effect, and parallax scrolling for modules.

There are 12 preloaders to choose from. You can have them to only appear on the home page if you want, and select their transition type and speed. The selector screen shows the preloaders’ animations. You can customize them further in the theme customizer.

Trigger the popups with any link from a menu item, button, link in text, etc. Create as many as you want. Choose any premade layout for the popup. Customize the background and close button in the customizer.

This is moving particles. You have full control over the color, shape, number of particles, speed, size, line size, opacity, and interactivity. There are two CSS ID’s for particles, letting you have two different designs.

Here’s a look at the tilt feature. You can adjust the tilt, perspective, scale, speed, and glare. Add it to any section, row, or module.

Divi Toolbox License

There are two to choose from:

  • Regular License (for use on one project) – €49.00
  • Extended License (for use on unlimited projects) – €169.00

Ending Thoughts

I’m impressed with the amount of features and settings this plugin has. I especially like that it adds related posts, previous and next links, and an author box to blog posts that are not created with the Divi builder. The scrollbar is also a nice touch.

There are a few settings that you can get to in the Divi modules, such as header text, but this provides more detail for those settings. I would like to see a few more adjustments added (for example, shadow effects for the comments box, more logo option, social media icon placements, etc.).

If you’re interested in added a ton of new effects to Divi in the easiest way possible, Divi Toolbox is worth a look.

We want to hear from you. Have you tried Divi Toolbox? Let us know about your experience in the comments below.

Featured Image via vasabii / shutterstock.com

40 Comments

  1. I can say cause I have it, that it’s a really fantastic plugin, and Ania a very talented professional. Highly recomended

  2. Definitely some great options. Wondering why some of these things like header customization isn’t just added into Divi so we don’t have to spend money with a 3rd party and worry about things not working properly.

    • Agreed.

    • Agreed to, some of the items (social media icons in header) should be a part of divi, and not a add-on. Although there are a lot of nice features in this plugin, definitely a nice toolbox.

  3. Hey, why did elegantthemes do this features not direct in the divi core? – All of that should be inside Divi, not in a extra Plugin. Sorry for that, but it looks like money making…

    best regards – alex

    • a-greed

    • I guess you are right DIVI should incorporate such features ….

    • It’s a 3rd party plugin, not made by Carpetcleaninghaddontownship.

      • What Alex is saying, and I agree 100%, is why aren’t most of these ‘features’ already included in the Divi core? 404 page, login page, footer editing should all be part of the core theme, they aren’t added functionality.

        • That’s the business policy.
          That’s why Divi has a huge community.
          People make money with Divi and Divi is getting higher and higher….

        • I don’t think this is what Alex was asking. I believe he was under the assumption that this was a plugin being sold by Elegant themes.

          Although, I do agree with you that more features should have been included in the Divi core theme and they should be adding more useful features with their updates (rather than spending time releasing new pre-made templates for use within the theme). How about a slider that actually slides for example, with the ability to use an image as the slider rather than a background image (you know, how most sliders actually work)?

          However, that said, we did know what we were buying into when we purchased the theme and we were given the opportunity of a money back guarantee when purchasing too.

          • I do love ET and Divi, but yeah, totally agree on the slider thing… it’s so simple that doesn’t make sense….

            • I agree with all the above opinions, the divi blog should not make a free (or even paid) publicity for any plugins that add extra features to the divi them. and if they think that this plugin would help us why don’t they add this features to the next updates, especially that many themes have already this features

    • After reviewing this plugin, I honestly don’t understand why these features aren’t already included in Divi Builder. I can’t justify purchasing a plugin for nearly $200 USD for an Extended License, when the features to support the cost, just aren’t there. Especially when these features all seem to be functionalities that should already come with the Core System.

      (Comparing to other Builders)
      Elementor, Oxygen, etc.

  4. I will check it out. Espesially a menu styling would be useful.

  5. Gostaria de obter o plugin, mas achei o preço bem alto. 🙁

  6. I guess you are right DIVI should incorporate such features ….

  7. Most of these features should already be a part of the Divi Core. This plugin has existed for years and some of these things ET has simply ignored, which is why it exists. No offense, but ET needs to step up their game and look at plugins like these more seriously. If Divi users are flocking to plugins that add rich features, it means the core theme is LACKING in critical areas that should be addressed.

    • This plugin has not “existed for years”, it’s brand new.

  8. This is what I object to. This plugin, lifetime, unlimited websites costs $50 LESS THAN a lifetime, unlimited divi membership. How in the world could I justify that, especially in light of the fact that what it does isn’t earth-shakingly wonderful. It’s just stuff that could/should already be in Divi.

    If the price weren’t so onerous, I could forgive all under the premise that ET was allowing solopreneurs to create piddly things and sell them for small sums and stay alive while concurrently keeping Divi a solidly going concern. For example, I will buy (and have) plug ins like Divi Booster and Admin Pae SPider, and Aspen Footer editor, and Custom Login Page Customizer, Divi Extended Columns, Divi jumping Header Fix, and Divi Switch, Page Builder Everywhere, and . . . well, you get the idea.

    But $197 for unlimited usage for these things? It just doesn’t feel right.

    I love Divi. But sometimes, reviews of products like these make me shake my head.

    • I agree !

    • I so totally agree with you.

      The cost is quite outrageously high.

    • Stuff like this is why I’m switching to Elementor. They add so much functionality, so fast – to their core. Sure, there are 3rd party plugins for Elementor too, but they sure are outrunning Divi.

      • I also like Divi but now i purchased Elementor. ET gives us many Sneak pekas but unfortunately it always needs months or years to get the features into core.

    • I agree sadly, At the current rate my currency is in this is almost impossible for me to purchase. I wonder if this is part of the delay for header customization. Its been promised for months 🙁

    • Totally agree. I’ll have to check out Elementor and do a side by side comparison.

  9. If I would have to program the same thing on every project I finish it would cost me a lot more than $170 dollars. I really love the plugin. I do have the extended license and I will be using it on every website/project from now on.

  10. Lets hope Black Friday will see some specials on the toolbox. I think I might just buy it as I am a little impatient on waiting on the changes to come.

  11. The tool has really nice functions, which also work.

    ALWAYS it has a decisive disadvantage, which is absolutely unacceptable.
    It slows down the performance of the pages by up to 3 seconds.
    We have tested this extensively – the results are catastrophic.
    Test it yourself, with and without plugin.

    Another point is the action_css, which is created by the plug. Compared to other tools, the codes are created completely randomly. It is almost impossible to copy and pace any of them into the theme options.

    All in all, this tool is for the ton – Sorry

    Miquel Ponza

  12. The tool has some really nice functions, which are also available in other tools for a long time.

    The difference to the other tools is that this tool unfortunately worsens the performance of a page by up to 3 seconds. We tested this extensively on several installations. The values for GT Metrix dropped from 2.2 sec to 5.3. In the Google Speed Test we dropped from 100 points to 69.

    These results do not lie and are unacceptable.

    Another point is the action_css, which is created by the plug. Compared to other tools, the codes are arbitrarily listed there. It is almost impossible to copy and pace any of them quickly into the theme options and then deactivate the tool.

    Of course we reported these findings to the support and have been waiting for an answer ever since.

    Sad story..

    • Thank you Bernd, that’s exactly what I came here to find out after reading the post. The last thing Divi needs it bloatware.

  13. I agree with these comments. I wrote this comment to support ET this a week ago with no answer : My opinion, Divi is great, you can make easily a lot of sophisticated design things and gain time
    but very simple things like adding an image in the footer credit or customising menus needs php/css/js coding and loose time…
    Amazing !!!
    I can understand divi eco systems add on but the prices are now to high for me… And there is no security guarantee written : for example this plugin can configure WP for SVG import. But SVG is known for trouble security, how is it secure by divi tools
    I think ET must control that before highlight a plugin …
    What do you think?

  14. Well, what I can say is that Divi Toolbox is so much fun and powerful. I love the beautiful interface and how simple and self-explanatory it is. Straightforward… Lots of different important details! Ania did a wonderful job!

  15. I also agree that these features should be a part of the Divi core. The Divi team has been very quiet for a few weeks now with feature releases, clearly, something big is coming. If its not I’m ok with that.

    However its a tiny sum of money to get the features and use on all your websites forever.

    If you want to use another builder. Do that.

    This is like the Android vs iPhone or the Xbox v Playstation adolescent arguments.

    Use what you want and enjoy, if you don’t enjoy anymore, stop doing that. Tired of reading comments from users ‘oh me oh my why is Divi so crap’, Seriously.

    I don’t have this plugin, I don’t see the need for it right now. But, if I was working on a project, I would know in advance the design spec and factor in the price onto 1 project.

  16. Really great plugin that makes Divi even better than it already was!

  17. I’ve been an Carpetcleaninghaddontownship member for several years now and this article is frustrating. You’ve made one of the biggest selling themes available (and props to everyone involved – the improvements in the theme over the last couple of years have been remarkable). Why can’t you add some or all of this functionality into the core? You’re big enough and successful enough… if you don’t want to code it just buy the plugin rights and bundle it into the theme. (Maybe instead of building layouts for everyone’s next Bank website project.)

    • Agreed.

Leave a Reply

Comments are reviewed and must adhere to our comments policy.

500,591 Customers Are Already Building Amazing Websites With Divi. Join The Most Empowered WordPress Community On The Web

We offer a 30 Day Money Back Guarantee, so joining is Risk-Free!

Sign Up Today

Pin It on Pinterest