Divi Mega Pro is a third-party plugin for Divi that adds the ability to create mega menus and tooltips with the Divi Builder. Since the mega menus and tooltips are created with the Divi Builder, you can use any modules you want, including third-party modules, shortcodes, and code, and style them with Diviβs tools. In this post, weβll take a look at Divi Mega Pro to help you decide if Divi Mega Pro is the right product for your needs.
Divi Mega Pro Builder
Rather than adding modules to the Divi Builder, Divi Mega Pro adds a new post type created with Divi layouts that WordPress menus and Divi Modules can display. Create and add as many as you want to any page and menu. A new menu item is added to the WordPress dashboard called Divi Mega Pro. This includes the Divi Mega Pro list, editor, and settings. Here, you can create and manage your mega menus and tooltips. Weβll look at each menu item in reverse order.
Divi Mega Pro Settings
The settings allow you to add a slide transition to the header, content, and footer. You can enable them independently. Theyβre disabled by default. The transition will change the content within the menu or tooltip while keeping its container visible. This forces the mega menu and tooltips into hover mode. I recommend enabling them unless you need to use the click mode.
Add New
To create a mega menu item or a tooltip, click Add New. This opens an editor where you can create the menu or tooltip. It includes the TinyMCE editor, and you can enable the Divi Builder to create it with Divi Modules. Youβll need to create a new item for every mega menu element you want to display. For example, if you want four different links in your header to show a different mega menu layout, youβll need to create four different items.
The editor includes lots of tools in the right sidebar and at the bottom including the standard publishing tools and custom fields options. Letβs take a close look at each of the custom tools.
Display Locations
Choose where the mega menu can display. Select between all posts and pages, all posts, all pages, or specific pages. You can add exceptions for all posts or pages to the field. If you choose specific locations, then you can enter them into the field. You can also select to show the menu on author pages and archive pages, and force render.
Mega Pro Animation
Choose the animation the menu or tooltip will use when itβs opened. Choose Shift Away, Shift Toward, Perspective, Fade, or Scale. These give the mega menus an elegant look and feel when theyβre opening and closing.
Mega Pro Triggers
Enter the CSS selector trigger into the field. It also shows the Mega Pro Unique Class that youβd enter into the CSS Class fields to display the layouts.
Mega Pro Display Settings
The settings include a lot of options. Choose the display direction, add top and bottom margin, choose the width, enter the maximum height, choose the CSS position from absolute or fixed, and enable an arrow.
If you enable the arrow, youβll see some styling tools to choose the type, color, width, and height. It shows a preview, so youβll know how it looks on the front end.
Custom Close Button Customizations
The close button customizations allow you to enable the close button on desktops and phones independently.
If you choose to customize the close button, youβll see another set of options to adjust the colors, font size, border radius, and padding. It also includes a preview so you can see how it will look on the front end.
Mega Pro Additional Settings
The additional settings allow you to disable the menu on phones, tablets, and desktops individually. Chose the trigger type between hover and click, the exit type between hover and click, and enter the exit delay in the field.
Mega Pro Background
This one is placed under the editor. It has a color picker where you can specify the background color of the menu.
Divi Mega Pro List
This shows the list of Divi Mega Pro items that youβve created. Each one includes the Unique Mega Pro Class. This is what youβll copy to paste where you want the mega menu or tooltip to display. Youβll need to create and copy each menu item individually to build your mega menu.
To add the mega menu to your WordPress header and footer menus, youβll need to have CSS Classes enabled. First, go to Appearance > Menus in the WordPress dashboard. Select Screen Options in the upper right corner of the screen and make sure CSS Classes is checked.
Next, open the menu item that you want to display the mega menu item. Paste the Unique Mega Pro Class for the mega menu into the CSS Classes field.
Repeat this process for every mega menu item you want to display.
Hereβs a look at this mega menu on the front end. Iβve used one of the demos thatβs included, as weβll see later.
Adding Tooltips
You can also use Divi Mega Pro to create mega tooltips. Simply add the CSS class to the element you want to show the tooltip. You can set the tooltip to open on hover or click. Any Divi Module can show a tooltip. Style the module as normal with the Divi tools.
To add the tooltip, open the Divi Module you want to show the tooltip. Go to the Advanced tab and paste the Unique Mega Pro Class into the CSS Class field. Save your settings and youβre ready to display tooltips.
Now when someone hovers over the element youβve added the class to, the tooltip appears.
The tooltips also work to create mega menus for headers in the Divi Theme Builder. Create the menu items with Divi Modules such as Text Modules, Button Modules, Image Modules, etc. I only recommend using Menu Modules to display standard menus as each link will either open a submenu or the page the menu points to.
Add the Unique Mega Pro Class to the CSS Class field in each element you want to have a mega menu item. You can use this method to create custom headers and footers. In the example below, Iβve created a menu using standard Text Modules as the menu links. Iβll add a mega menu layout to each one.
The menu items will work as a normal menu and display the mega menu items on hover or click, depending on your settings. In the example below, Iβve hovered over the first menu link and the mega menu for that Text Module has opened.
Divi Mega Pro Templates
Divi Mega Pro includes 15 templates to get you started. Theyβre provided as JSON files. Upload them to your Divi Mega Pro editor and use them to create your Divi Mega Pro layouts. They include eCommerce banners, tabs, CTAβs, contact information, a login form, blog posts, and lots more. The layouts are well-designed and work great with any style of the website.
The templates are fully customizable, so you can adjust them to include your branded fonts and colors. This is template number 9, which creates eCommerce menus for featured brands. This shows the wireframe view within the back-end editor. You can also view the layouts on the front end. Mine displayed the layout with the sidebar by default, although Iβm sure that can easily be disabled to show the layout in full width.
Hereβs how it would look on the front end. This is the back-end editor showing the desktop view.
Where to Purchase Divi Mega Pro
Divi Mega Pro is available in the Divi Marketplace for $79. It includes unlimited website usage, one year of support and updates, and a 30-day money-back guarantee.
Ending Thoughts
Thatβs our look at Divi Mega Pro. I found creating and using the mega menus to be intuitive. Since it uses any Divi Builder module, creating the menus and tooltips works the same as building any Divi layout. The extra features, such as animations, buttons, etc., provide even more control over the design and specify how the menus and tooltips work. It works well with pages, posts, WooCommerce products, and more. The added templates are a great way to get started. If youβre interested in creating mega menus and tooltips for your Divi websites, Divi Mega Pro is worth a look.
We want to hear from you. Have you tried Divi Mega Pro? Let us know what you think about it in the comments.
I expect similar navigation menu functionality to be finally made available as part of Divi core, the upcoming Divi theme builder. It’s been seven months now since the theme builder was announced. We should not have to implement third party plugin after plugin for what should have been part of Divi a long time ago.
Hey Frank,
The functionality in Divi Mega Pro will likely never be included in Divi. We designed it in anticipation of Diviβs future header builder, and will be able to be used alongside it to extend it and make the drop downs βmega.β ?
Trust me when I say that full mega menu is coming to DIVI core. It may not show up in the first version of the header builder, but I say it is coming.
Actually Richard, I have it on very good authority that it isn’t something ET will be adding into Divi. Regardless, even if it did eventually make it into Divi core, that would be a very long time away. I’m curious though, what was the purpose of your comment?
This should be part of Divi. But at least we no know that it won’t be, for whatever reason… Thanks for confirming…
“what was the purpose of your comment?”
Maybe just this: “We should not have to implement third party plugin after plugin for what should have been part of Divi a long time ago” ;-(…
One of the guys at GoDaddy actually laughed when he saw how many plugins I have. He told me that even their huge clients with millions of visitors don’t have nearly as many as I do. I need another plugin like a hole in the head. Maybe Richard’s comment is good to consider, especially since your plugin comes with an annual price tag.
As soon as the competitors will put Mega Menus in their core, I guess that ET will do the same, even if they actually don’t think that they are gonna do. I would never say never and I wouldn’t for sure say for sure π
Yeah, me too like to see this functionality built into the DIVI core.
+1 I agree, mega menu (and alternative mobile menus) should be core to Divi.
That and MUCH better photo gallery options!
Thanks so much for the excellent write up, Randy! While Divi Mega Pro is our newest plugin, weβre excited for its potential and look forward to adding more features, and templates ?
Does the Mega Pro allow the function to click open instead of the hover reveal which is particularly annoying when trying to navigate around the page when a menu has several sub items, virtually mouse navigation on the whole page reveals menu when not required
Yes, in the screenshots Randy showed above, I see that you have the option to reveal and hide the menu based on either clicks or hovers.
You’re welcome Tim! This is an excellent plugin! I can’t wait to see the new features and templates.
Thanks so much for the excellent write up
nice one
I purchased this plugin and like it but I never was able to embed the blog module in the mega menu which I really wanted to do. This was actually shown in the plugin demo page. I was told this functionality would require their additional divi library short codes plugin. After acquiring that plugin I still could not get the blog module to function properly. I was then told that they were working on releasing more detailed templates and tutorials.
I think it has great potential and I just wish at least they would provide guidance or samples for the mockup mega menus they used on their sales pages…
I am holding out hope that they eventually deliver though as I believe their operation is a quality one!
Hey Andrew,
You can definitely add blog module inside of a Mega Menu with Divi Mega Pro without anything additional needed. What you wanted to do was add the blog modules inside of the tabbed module inside of the Mega Menu layout. Divi does not natively allow nested modules, so we created a plugin from scratch to allow this π You’re right, since our Divi Library Shortcodes plugin is brand new for Black Friday, we don’t have a tutorial for it yet. However, my support team offered to help you set it up, but you never got back to us. Reach back out and we’ll assist π
Hi Randy,
Like many, I’m not always happy to see Divi promoting other plugins.
The Divi Menu is so lacking in advanced styling and function however we have added a mega style menu following this Elegant Themes post:
https://www.elegantthemes.com/blog/divi-resources/adding-images-to-your-divi-mega-menu
Looks and works great however Divi Mega Pro seems to do alot more. Can you tell me out of interest? Using Divi Mega Pro, if your menu is fixed width, can Divi Mega Pro be set to be full screen width?
Many thanks, Pete
Hi Pete,
Yes, Divi Mega Pro has the option to set the width to 100%, 75%, 50%, 25%, or a custom width in pixels or percentage π
Wow, cool plugin. I like this demo.
It may be worthwhile to modify the adaptive look for the smartphone. For some reason, I could not close the window with the “login demo” on the demo site. I tried to even press ESC, but the window did not close. Perhaps this is a problem on my side, but please check it.
Thanks for the great news! I hope to buy your plugin soon
Thanks to ET and Randy Brown for an excellent writeup on this plugin, and especially for working with enhancement developers like DiviLife.
Big kudos and thanks to Tim Strifler for putting this together; I’ve been evaluating WP mega menu plugins for a long time – never got one – and have used the Divi MegaMenu capability (it’s THERE but obscure, and awkward to style), and I’m looking forward to implementing this plugin in the near future.
However the BIGGEST PLAUDITS go to both ET and DiviLife for offering LIFETIME subscriptions. I only wish more developers did this.
#DiM: Not only that, but DL offered a 30% off on ALL purchases for the black sales days and I bought the Access pass. I have immediate plans for 3 of the plugins! They solved a design issue I have been cogitating on for about 6 weeks.
# Frank: IMO, this is NOT something I would expect in the core of Divi. These plugins have so much more capabilites than simple menus.If ET were to suck up all the great plugins and incorporate them, that would destroy the incentive for non-ET folks to design new things. And then those who WERE designing them might have the attitude of “Get it now before Divi steals it.” That’s an environment that could encourage lack of design concern on creating something that lasts and has support.
I like it like it is.
Hey David!
Thanks for the feedback, and glad to hear you like the plugin! And yes, everyone loves the Lifetime membership! ?
I’m super sceptical after using several menu plugins for Divi.
Looking through the article, playing with the demo and seeing the sales page I’m not excited. Note, I’ve NOT used DMP, and this is just my assumption based on my past bad experience.
Because I’ve not used DMP let me brag about what I’ve learned to pay attention to, from using a fair amount of menu plugins in conjunction with Divi – especially the latest one called MHMM (terrible name by the way – makes everyone cringe as soon as the name comes out…).
First of all, we spent $129 for a lifetime license, and now after almost a year, it is crystal clear that BeSuperfly abandoned the plugin a week after it was released. However, MHMM is not the first time we sunk money on a “lifetime license plugin”. It (sadly) appears to be a common pattern with these Divi-related companies coming out of the woodwork. For example, from DiviLife we’ve had Divi Bars LTD ($129) purchase that after months and months still messes every Divi website we put it on. With almost every design there needs to be some intervention/manual CSS tuning – sometimes different adjustments for each page (?). Never-ever had this happen with Convert Plus bars – a plugin that was never designed with “just Divi in mind”. Makes you wonder…
Lesson 1 – be careful with throwing the big buck on the LTDs before testing them out.
Lesson 2 – don’t assume that just because someone called their plugin “Divi Exclusive” it means that the “Divi-plugin” is suddenly better for your Divi-website than a generic, well-regarded WP plugin.
Anyway, back to the Divi-menu…
Here’s what came up with MHMM but may as well be relevant to DMP:
– Number #1 and by far the most dreadful is the lack of performance optimisations. After the recent Google PageSpeed update the mobile view with MHMM drops below 50pkt (red) on all the websites with it – no matter the amount of minification and optimisation gymnastics we do. I see around 20pkt drop just on that plugin. Period. And there is no reason for it other than developer’s ignorance in refining the code. There is JS in the header – mostly for no reason – and if you touch that the menu just breaks. Of course, pathetic drops in SEO follow – I see it on SE Ranking and Ahrefs every time, beyond any doubts. Though DMP has an ok-ish GPageSpeed score (~55) on the Demo site, so it gives me some hopes…
– We bought it on the promise of Visual Builder integration, but nothing was done for a year, so we gave up waiting.
– The speed of building these menus just takes forever. The clumsiness in modifying/previewing the design and the need of following those sloppy-workarounds are just so “not-Divi-like” that it is actually better and faster to use default Divi menu and style it with CSS on a notepad. Looking at the article and the screenshots, I’m worried DMP is the same…
– … which takes me to the last point – because of a terrible time/value ratio the inevitable question follows “are those plugin-gimmicks really worth all that hassle and money?”. – More often than I would like, they never are…
So just recently, we’ve decided to completely move to the Divi default menu and apply CSS template styling with quick Microthemer refinements.
As Frank here already mentioned, the only real solution is WP Menu integrated into the Divi core by ElegantThemes. Because all those “mega” menu plugins just ain’t “Mega” enough…
But feel free to prove me wrong π
Hi Lucas,
At first glance someone may think you’re talking about Divi Mega Pro, which you’re not. π Mhmm is not our plugin, so I can’t speak to any of the issues you’ve brought up. However, from what I hear in the community, a lot of people like Mhmm (despite the terrible name π )
Mhmm is a header builder, while Divi Mega Pro is a mega menu builder. So they’re very different.
But don’t let a bad experience with a completely different plugin from a different developer sour your experience from a plugin you haven’t tried π
Tim, – the points I’m raising stand – i.e.
– the overall speed and performance impact,
– compatibility with CSS/HTML optimisation plugins,
– Visual Builder integration,
– automated vs manual styling input,
– and the frequency of the plugin updates (future developments)
All these apply to your product even more so than to MHMM because yours has a “mega” scope and your customers will have to deal with those questions at some point, guaranteed…
Hi Lucas,
I appreciate your response. Correct me if I’m wrong, but you’re saying because another plugin (by another company) had these specific issues, that my plugin does too? That doesn’t seem fair…
I’ll address your concerns thoughβ
β the overall speed and performance impact:
We’ve done lots of speed testing and no noticeable change in load time when the plugin is activated. We used speed testing through Pingdom for the tests. As you probably know, the same tests from the same location on Pingdom will range within a quarter of a second typically. With the plugin inactive, we saw results within the same range as when it was active. And the page size was only .1mb larger with the plugin active. It’s also worth noting that these tests were done without any speed optimizations done such as caching plugins, image compression, CDNs, etc. Reach out directly and I can send you some more specific results on our speed/performance testing.
β Visual Builder integration:
Divi Mega Pro isn’t a module like Mhmm is, so this isn’t really a concern. DMP is a custom post type. Currently the Visual Builder requires custom post types to be accessible on their own URL, and DMP can only be accessible on the front end when triggered. However, this will change when the Visual Builder comes to the backend (should be the next Divi update), and then DMP content can be edited directly in the VB. Currently, customers that want to design the mega menu using the Divi Builder can do so from the Divi Library, then import into the DMP custom post type.
β automated vs manual styling input:
I’ve never used Mhmm, so I’m not entirely sure what you’re referring to. But the styling in Divi Mega Pro is done via the Divi Builder just like a page or post. Once the VB comes to the backend as mentioned above, this will be even easier for those that prefer designing in the Visual Builder (many of our customers are still die hard backend users π )
β and the frequency of the plugin updates (future developments):
Divi Mega Pro is still a brand new plugin, so we’re still on 1.0. We are working on better mobile control, and that will likely be the first feature update. As for bugs, we haven’t had any reported besides a couple of conflicts with some specific plugins from one customer. We’ll likely push an update in the next week for those. For our other plugins, we’ve pushed 14 public releases of Divi Overlays, and 11 of Divi Bars since they were released. Each update contains several fixes or new features each. The change logs for both are public.
Let me know if you have any more questions/concerns. Feel free to reach out to me directly. We are committed to our products and while no software product is perfect, we work hard to make our products better and better, and we do so by customer feedback.
Tim, –
“Correct me if Iβm wrong, but youβre saying because another plugin (by another company) had these specific issues, that my plugin does too? ”
– Nope. Just for you to address the basics head-on…
… Which you did very well, thank you very much π
– now I’m tempted to try the plugin out.
P.S.
“β automated vs manual styling input:” I agree, this is a bit subjective and impossible for you to know as it will depend on each case.
Though, what I’m referring to is the type of “Divi-plugin” that every time I go beyond the visuals given in the plugin’s template, I’m presented with X-amount of convoluted CSS classes I now need to figure out and adjust in my notepad. Which defies plugin’s original purpose (i.e. saving time and efforts). It’s hard to pinpoint the specifics, but I know it when I see it… π
PLEASE ALWAYS REMEMBER TO show the end result first before you delve into the details. This is basic communication skills.
Yes, my first lokk (search) is allways “View Live demo” or similar.
hmmm, nice,
I just visited the Demo Page and tryed it in Mobile Viwe
but how can I reach in the mobile view on the Menu”Tabs Demo” the single tabs?
I actually just used it on a client project to create a mega menu item for a newsletter signup form. I must say, it worked very well and looks really cool with the βperspectiveβ animation.
Hi Nora,
That’s great to hear! Thank you for sharing your experience! π
Thank you for the divi article.
Thank you Nick and ET for supporting your Divi lifetime members with this Divi Mega Pro tutorial. Any more you can offer on Divi Mega Pro would be much appreciated.
I bought a lifetime membership for Divi Mega Pro last week. They don’t have any meaningful documentation for this product, nor for any other the other templates that come along with this product. I wrote them to complain and they didn’t have the professional courtesy to even respond back. This was a very bad user experience for us and with no recourse to get a refund.
Hi Dennis,
Thanks for purchasing Divi Mega Pro! Did you see the Getting Started tutorial and video? We go through the entire set up process. This is still a very new plugin, and we will be adding more tutorial videos on specific features and use cases. We do have templates you can download. From within your Divi Life account, go to Purchase History > Plugin Layout Templates. I am not finding a support ticket for you in our system. We have a full time dedicated support team, and we always respond to all tickets. Log into your Divi Life account and in our support system you will see any open (or closes) tickets. Perhaps your ticket did not get successfully submitted.
Thanks Tim, I will resubmit it.
#DiM: Not only that, but DL offered a 30% off on ALL purchases for the black sales days and I bought the Access pass. I have immediate plans for 3 of the plugins! They solved a design issue I have been cogitating on for about 6 weeks.
# Frank: IMO, this is NOT something I would expect in the core of Divi. These plugins have so much more capabilites than simple menus.If ET were to suck up all the great plugins and incorporate them, that would destroy the incentive for non-ET folks to design new things. And then those who WERE designing them might have the attitude of “Get it now before Divi steals it.” That’s an environment that could encourage lack of design concern on creating something that lasts and has support.
I like it like it is.
Thanks Randy for purchasing our All Access Pass, and for your input here! And I agree with you π
“If ET were to suck up all the great plugins and incorporate them…”
This is the wrong way of putting it! Divi has been slow in adding functionality and features that have been on the backburner way too long. Other pagebuilder plugins have added many of these in the meantime.
It is not ET ‘sucking up’ but lagging behind….this has resulted in plugin developers to take advantage to fill the void in the MEANTIME.
I really like these kinds of Menus. But when do you have the new header or footer added to Divi Theme?
Some good points raised in the comments above. I decided to buy DMP as part of the BF sale week and admire anyone who buys a LT licence off the bat. For the price – it’s worth a punt to get your hands dirty and see if firstly – it does what you think you’re being told it does and secondly to see if you can live with it.
I’ve used Ubermenu on a couple of sites and doubt there is anything to match it’s functionality but using the existing/old/clunky WP menu builder is one right PITA when you have a menu system that actually uses that functionality.
Having bought DMP I was a little disappointed to see how few of the promised templates were actually there. Yes I can build them myself but it was kinda implied in the video they’d be there. They weren’t. The instruction video is OK but is really basic and you’ve really got to find your own way.
Would this be a good moment to mention the avalanche of emails after BF – please don’t force me into unsubbing Tim.
Finally I don’t want to see this functionality built into the Divi core because it’s already pretty damn big already and many sites won’t need that level of functionality. I like Divi because of the ecosystem. If ET keep rolling in 3rd party functionality devs are going think – sod that for a game of soldiers.
Hi Richard,
My apologies not all of the templates have been added yet! Now that Black/Cyber is over, our priority is releasing the rest of the templates and ramping up the documentation π
The first thing I immediately feel loud and clear from comments is the argumentative “People Skills” !! lol π sadly it distracts a little from the really great post. It also makes me notice that perhaps maybe? something may have been released without being properly prepared. This is a vibe I get. In turn this makes me not want to bother to look at a new plugin, just a thought from a Older person’s perspective π I guess you have to be on the planet a bit longer to see it this way….
Or perhaps it triggers for a reason….
It’s a good article but it actually raises some important issues albeit from an angle about the role of plugins, the state of some of them and their developers and peoples expectations of both ET and Divi and their relationship with devs.
Speaking as a mature 61 years who has been round the software block a few times I generally go into these things with an open mind and realistic expectations.
Hi Liz,
I’m not sure if you’re referring to my comments specifically, but isn’t discussion what comments are for? π
Hello,
I use this plugin on several website and I must say that it is a really great plugin. It really changes the way to make a website.
Thanks Bruno, that’s great to hear! π
Now that I know that ET will not be introducing this feature to Divi anytime soon I’m thinking of purchasing Divi Mega Pro. Does this plugin slow down your site in anyway?
I’m trying to be carefully selective when adding plugins. But it looks like a really good solution for varying the look of the menu.
Nope π Weβve done lots of speed testing and no noticeable change in load time when the plugin is activated. Feel free to reach out to us directly if you have more questions.
Hello,
After a proper step by step installation, the current Divi mega pro version (1.1.1) it doesn’t work with Divi Builder 2.19.6.
Finally it works fine after several tries (erase cache , logout & login…)
Please give a good update of the Sir Testimonial slide and please
After acquiring that plugin I still could not get the blog module to function properly. I was then told that they were working on releasing more detailed templates and tutorials.