If you have a large amount of content on your site which you need to provide access to in your main navigation menu, this can become quite overwhelming to site visitors as they hover over your menu and a million drop downs appear, grouping your content can be quite a challenge. One way to overcome this is by providing visual cues such as icons and graphics but most themes do not provide this functionality out of the box.
To help with this, enter “Mega Menus” which is a bit of a marketing term but describes a menu which when hovered over, provides a large amount of links to the various parts of your site. What sort of sites make good use of these ? One type of site springs to mind – eCommerce sites, these sites typically have many product categories and maybe sub-categories so a Mega Menu is perfect for them. To see an example in use, then look at the eCommerce pioneers Amazon who employ one on their site:
You can view further example in this post “25 examples of Mega Menus” to give you more ideas of their usage. Along with the benefits to site visitors they are also good for search engines as you can highlight the important sections of your site and direct them to it via regular HTML links contained in the menu.
In this post I’m going to take a look at the Suppamenu plugin which is available for $ 16 from Codecanyon which will help you create a WordPress Mega Menu.
Create a Menu
After you have uploaded and activated the plugin, you can begin creating a menu as you would normally but you will see some extra options such as a skin drop down down for the menu you create which allows you to pick from some set styles.
You will see the menu now has some extra options now, added by the plugin so you can choose which type of menu to create – Drop down, Mega Links, Recent Posts, Mega Posts and you can also choose to use the menu as a search form, social media or a WooCommerce cart which are great options to have.
Every link you add to the menu also has some options which are – show link to logged in / out users, position, use icon only, you can upload an icon or choose a font-awesome icon:
Choose a font awesome icon for each link in your menu :
You can visit your site to see the menu in action :
Resize your window and you will see the menu is responsive:
Configure Options
This plugin adds its own menu where you can configure many settings to get the menu looking just how you want it – there are a number of pre-configured skins to choose from or you can create your own and save its settings :
Under the main “Settings” section you can set jQuery options, resposive options, whether to make it a sticky menu, upload a logo and so on.
Under “Menu Style” you can create your own color schemes, add borders, rounded corners, choose fonts and so on :
You also have options for the responsive styling, icon styles and a section for any custom CSS.
Conclusion
There you have it – a nice and easy to use plugin which will allow you to create highly customizable menus for your site with a lot of content which needs organizing. The initial menu creation will probably take quite a while to get looking how you want it as the process of choosing icons and styles for each item is slower than creating a regular menu but the large amount of customization available with this plugin will help you to create an attractive and functional menu.
Take a look if you’re looking for a solid plugin to handle larger WordPress menus.