Articles Web Design

How to Create a Mega Menu with Elementor Builder Quickly and Easily

No ratings yet.

The bigger your online shop is, the more categories you need. The more categories you create, the harder it is to navigate them. The harder it is to find something, the fewer customers you have. That’s all obvious and ruthless, but it is true. Of course, you would be happy to place all those categories of products right to the header menu, but eventually, there will be no spare place there. That’s where a mega menu will come for rescue.

create mega menu

Certainly, there are solutions to the problem of navigation. You can sort the categories in the sidebar, create a pile of links with icons directly on the homepage or create a sitemap, but a mega menu is much more convenient.


Table of contents

  1. What’s a mega menu?
  2. What sites need mega menus?
  3. How to create a mega menu rapidly and easily?

What’s a mega menu?

create mega menu

When I was a child, one of my friends had Dandy and spent lots of time playing Mega Man on it. The mega menu sounds a little the same, so I have a lite nostalgic feeling writing about it. Of course, there’s no connection between the heroic android and website feature, but who says it has to be some logic in our associations?

Mega menu is, as you can understand from the name, is a huge menu. When you click on one of the header items and see a big section that can contain links, images, and even videos – you are looking at the mega menu. You can put the entire website navigation into a mega menu and help the customers see a whole picture.

This feature often increases sales, and the reason for that is very simple – a mega menu shows a visitor lots of stuff he wasn’t searching for right now, but may decide to buy, since he is ordering other products from you. To understand what I’m talking about you should go to the Amazon or eBay website. They have carefully thought out mega menus and get lots of profit from it.

amazon
eBay

What sites need mega menus?

Online stores

As I mentioned previously – the mega menu is necessary for any medium and large eCommerce project. The better your products are organized – the more sales you get. Even a small online store could gain profit from an accurately crafted mega menu with bright pictures. All big stores that have a huge number of products use mega menus. For example, look at IKEA’s website:

ikea

Information hubs

News websites, content aggregators, online libraries – all that websites deal with a vast amount of information. All those precious treasures have to be easy to find. Otherwise, it will become a bunch of useless crap. The mega menu will help to organize the information so that a user will be able to intuitively understand where to go. Huffington post has a nicely organized mega menu:

huffpost

Government offices

Bureaucracy, especially government bureaucracy is equal to tones of documents. And some of them could be necessary for people. For example, “how much taxes do I have to pay?” or “how and when could I get an ID card?” are the questions people want to find answers to without any issues. Some government offices use mega menus to make their information more accessible. It works perfectly on usa.gov website:

usa-gov

Renting services or cafés

The pictures of beautifully served food or nicely designed room is more likely to attract a visitor to make an order in your restaurant or hotel. A café menu with sharp pictures that drop down from the header or a list of the rooms organized in a mega menu will be a creative and attractive solution for your business. Riad hotel and restaurant has a very original mega menu that gets a user to all the rooms of a house.

Renting services or cafés

elementor wordpress plugins


How to create mega menu rapidly and efficiently with JetMenu Elementor plugin?

The website is ready, you have a fancy template and are at idle to add a mega menu to the header. Certainly, there are plugins to do it from WordPress, but I have Elementor page builder installed, and it is really much easier to create a mega menu from its visual panel that from WP dashboard - that’s why I’m going to tell about how the JetMenu plugin could help you to create a mega menu.

First of all, you will need a JetMenu Elementor plugin. Download and install it in the “Plugins > Add New > Upload plugin” tab of your administration panel. After activation, JetMenu will appear in the dashboard menu and will be available for work.

Now, when all the tools are ready – it’s time to do some magic. Go to the Appearance > Menus. JetMenu appeared in a list of settings, open it, enable the plugin for “Top” and “Main” locations and hit the “Save” button.

save button

The window to the right shows you the menu name and structure. Every line could be customized not only via WP functionalities but also via JetMenu. Hover the pointer over the list and click the “JetMenu” button on the proper item.

jetmenu button

Enable the mega menu for this item and press the big green “Edit Mega Menu Item Content” button.

Edit Mega Menu Item Content button

Elementor interface is the same as you are used to – the construction elements are gathered in a table to the left from the workspace. The user will see all you put to that space after clicking on the menu item.

menu item

You can drag-and-drop everything you want/need to the field. You can customize the chosen fields via the settings - that will open in the table to the left. To my mega menu, I added the custom posts block, Google Maps, and a video tile. The map and video are placed in the two-columns section so that they are accurately located in the mega menu. When you finish the building process – hit the “Update” button.

update button

On your website it will look something like that (your template could look different and, besides that, you will definitely customize the look according to your taste):

look website

That’s it. You did it. You’re fabulous. Of course, it is only the beginning. There are dozens of features available for you to customize it in your mega menu appearance. The JetMenu goes with well-written documentation, where all the details are described more vastly. To create a mega menu, I spent no more than 20 minutes (and that includes JetMenu installation). If you want to play with customization a little longer, you can achieve results like this:

jetmenu

JetMenu is not the only plugin that helps you to build your website faster. TemplateMonster’s Elementor Marketplace has a bunch of goodies for you – check them out! We gathered products that will give you additional elements, new pre-made pages, and whole Elementor-compatible themes. Everything for Elementor-lovers’ convenience!


If you have any questions, go through the documentation or write your questions in the comment section below. Would you like some additional information added to the article? Was everything clear? Feedback is always welcome.



Read Also

JET Plugins for WordPress Elementor Builder [Review]

Elementor Marketplace Just Hit the Web Templates Market

Best Navigation Menu Plugins For Your WordPress Website

How to Install Elementor WordPress Template?

Leave a Reply

Your email address will not be published. Required fields are marked *