A mega menu is essential for eCommerce websites, listings directories, or just sites with a branched structure. It is also a great marketing asset because it allows placing promotions, deals information, and featured categories right in the menu – the place the user never forgets. Without even mentioning that it gives easy access to any page, post, or product on your website.
There are two main formats that any mega menu can consist of: a dropdown (a horizontal one that opens downward) and a flyout (a vertical one that opens to the sides). Here is an example of a dropdown mega menu:
An example of a flyout mega menu:
JetMenu Overview
JetMenu is a WordPress mega menu plugin for Elementor and Gutenberg, 100% visually editable. It is essentially another Elementor/Gutenberg container where you can add any widget or block you want, including another menu (submenu), dynamic fields, pictures, videos, animations – whatever you wish. Each of those items can be stylized separately; the settings are the same as for the rest of the blocks or widgets in those builders.
Of course, those widgets can be combined as you like. It doesn’t require Elementor Pro, and the process of building menus is extremely simple and entirely intuitive. They can have any shape and size, and the long list of plugin settings will help you to get exactly what you need. The plugin automatically renders a beautiful mobile menu, but there is an even bigger list of settings for this type of menu in case you are willing to change anything.
Pricing: $43 (for one website), $88 (for unlimited websites), paid annually. The support is included.
The Lifetime license is for the whole package of 20 Crocoblock plugins (also includes lifetime support, updates, 13 premade dynamic websites, 47 design templates, and over 200 pop-up templates) for $999.
How to build a menu with JetMenu using Gutenberg
For a long time, the JetMenu plugin could only be edited with Elementor; however, the recent update has made it possible to edit the mega menu with Gutenberg. It increased its functionality even further because if you prefer building your website with the Block Editor, JetMenu will be in your toolbox to use not only for main navigation but throughout the website for different purposes.
How to build a menu with JetMenu mega menu using Elementor
The first thing I would recommend doing before creating the menu is to visualize the structure you want. The perfect way is to draw it somewhere, so you will get ideas on how to structure or stylize it even better.
All general settings for this plugin can be found at Crocoblock > JetPlugin Settings > JetMenu. There is a massive list of options for the overall styling, caching, animations, and separate settings for both desktop and mobile versions. The adjustment of particular menus is available right in the default WordPress Menus section, though.
First, go to the Appearance > Menus > Add New and create a parent menu structure. Let’s say I make a menu for an apparel shop, so I will have “Shop,” “Men,” “Women,” “Sale,” and “Contact us” buttons on the top level. Then, I want to turn the Women section into a mega menu with three submenus and one slider of best-selling items.
The items to place in the mega menu section are the following:
- Promo menu (New Arrivals, Sell Out, Final Stock Sale);
- Accessories (a list of subcategories of accessories);
- Collections (a list of collections);
- Dynamic slider based on the custom query.
I then go to the standard WordPress Menus dashboard and create separate menus for each of the three subcategories.
Then, from the Main Menu, hovering over the “Women” button makes the Settings button appear. The Use Mega Content toggle is switched on, and “Edit Content” opens the Elementor editor. From there, the entire mega menu section can be built visually.
To add the submenus I created earlier, I insert either the Mega Menu widget (for a horizontal layout) or the Vertical Mega Menu widget (for a flyout vertical layout). Then I select the menu to display, and it appears.
The mega menu section edits just like any other Elementor section, with full control over columns, rows, backgrounds, images, videos, and any other widgets needed.
These are widgets and elements I’ve used:
Very straightforward, right?
Watch the full guide on creating the menu and making all the adjustments for even better performance and responsiveness:
JetMenu pros & cons
Pros:
- Elementor/Gutenberg-compatible, which means that both of the most popular WordPress builders have all the tools for creating advanced menus.
- It is a tool developed not only to make your header navigation look good and complete, but also to add such functionality to sidebars or even insert them in the middle of your landing/categories or any type of page. It all depends on your creativity.
- It is highly recommended to use other plugins from a Crocoblock subscription to utilize the capabilities of this plugin fully. JetBlocks and JetThemeCore plugins are the best friends of JetMenu. And with the help of JetEngine, you can generate and add all kinds of custom dynamic queries to your menu.
Cons:
- If you build a large menu in Elementor, consider the fact that this builder adds quite many containers, which will negatively affect performance, as these containers load on every page and above the fold.
UberMenu Overview
UberMenu is an excellent mega menu plugin, offering numerous settings and flexibility in building such menus. It supports displaying menu items in columns and rows, and tabs. It allows you to insert shortcodes and widgets created in the default WordPress widget section. But, to be fair, there’s not much flexibility in stylization and proper displaying, so don’t rely on them too much.
Thus, it is a powerful mega menu builder with numerous settings, and custom configurations can be created using a set of individual properties.
For the mobile view, it creates a responsive version of a desktop menu. It is not too fancy, but still not bad. If you want, the menu can be displayed only on the desktop.
Pricing: the core is $26, plus four extensions (Icons, Extra Skins Pack, Sticky, Conditional), each costing $8. So, the final price is $58 (Lifetime license). It includes six months of support.
How to build a WordPress menu with UberMenu
First, look at the prototype of your menu and get an idea about the pages and endpoints required. Create the parent menu structure and start adding submenus. Let’s say I want to add a mega menu under the “Men” top-level button. I want to add the following blocks:
- Accessories submenu (with a list of subcategories);
- Clothing submenu (with a list of subcategories);
- an image.
Every menu item has an UberMenu button, and when clicked, the plugin’s menu opens with various settings. It also has its special menu elements, like Column, Row, Divider, Tabs block, Dynamic Posts, Dynamic Terms, Menu Segment, and Widget Area.
It may take some time to learn the settings when using the menu editor for the first time, especially when adding multiple columns and rows for more complex layouts. You can also use the menu settings in the Customizer, if that works better for you. However, for more detailed settings, you should use the plugin’s editor.
UberMenu plugin pros & cons
Pros:
- The price is low, and it’s a one-time payment.
- The plugin offers a wide range of features, and everything is highly customizable.
- It has a Conditional extension to enable showing different versions of the menu to different users for different post types.
- It’s lightweight.
- Several configurations of general settings can be created and used for different menus, which makes stylization a lot more flexible.
Cons:
- A compatibility issue. Some themes can interfere with the UberMenu plugin. In this case, you have to integrate it manually. That means replacing the default menu code with the UberMenu code snippet.
- The plugin seems a bit abandoned, with quite rare updates.
- It requires some time to learn how to use it.
UberMenu vs. JetMenu: Similarities and Differences
The logic behind those two menu builders is very different. It’s a little bit of an apples-to-oranges comparison. Let’s see why.
The logic behind UberMenu and its unique features
UberMenu for WordPress is a standalone plugin that offers excellent functionality and numerous options for styling and customizing menus. And I love its Conditional extension a lot. It allows for the creation of responsive menus with an extensive choice from the skins it has (again, with the Skins extension).
It is user-friendly, and even if it requires time to learn how to work with it, in the end, you will be able to create fantastic mega menus.
Such menus can be inserted in different places on the website using a shortcode. Yet, they still will have a more classical shape and structure.
The logic behind JetMenu and its unique features
First and foremost, JetMenu is a part of an extremely powerful Crocoblock suite, which is a true money-saver for what you get, especially if you are an agency or a freelancer with a lot of clients. The Lifetime subscription would be a steal in this case because you will receive not only frequent updates and new features, but also new products.
JetMenu, in combination with other JetPlugins, can definitely elevate your website: used conditionally in various places of dynamic-data-driven websites for different purposes.
There’s much more to compare, but the deciding factor for choosing one of those plugins is the interface and your preferred way of editing menus.
Here is a table for a more visual head-to-head comparison:
FAQ
The mega menu in WordPress is similar to this type of menu found on websites built with any other CMS or framework. Moreover, WordPress provides the freedom to create highly advanced, beautifully designed, responsive, and speed-optimized items. However, a separate plugin is required to create them, as the default WordPress menu doesn’t have the functionality to construct mega menus.
It’s an amazing asset for driving sales if you have a WooCommerce store and want not only to show your products in categories but also to add some promotions, sales information, media, and other objects to attract attention. Additionally, the mega menu role is crucial if your website’s structure is complex, but you want to provide clear navigation in your menu.
Yes, because nowadays, there is no chance to make anything non-responsive. If you come across mega menu plugins that don’t offer good options for creating a great menu version for mobile devices, avoid using them. Good WordPress menu plugins normally have a choice: either optimize the desktop version for mobile devices or create a separate, bespoke, and user-friendly version for the smaller screens.
The Bottom Line
The problem of choice, in this case, basically does not exist. Either you love working with Elementor and Block Editor, and huge flexibility is seen as an advantage, or you don’t like those WordPress editors and prefer more rigid solutions.
If you just need a cool mega menu plugin with many perks, the UberMenu WordPress mega menu plugin will be a good option.
If you are already a user of the Crocoblock subscription or considering buying it, the answer is obvious. Just don’t overlook the capabilities of the Crocoblock mega menu JetMenu plugin, and enjoy the variety of capabilities and freedom it gives.
Those two plugins are worthy rivals and among the best mega menu plugins for WordPress on the market, so the choice is yours. 😉
