Blog

WEBFI-WordPress-How to Add a Mega Menu on Your WordPress Site



Looking to add a mega menu to your WordPress site? Mega menus allow you to add multi-column drop-down menus to your navigation with media items such as images and videos. In this video, we will show you how to add a mega menu to your WordPress site.

Mega Menus are helpful for sites that have a massive amount of content and are designed to show more content in the top menu. WordPress navigation menus by default let you add drop-down submenus and image icons but can take up a large amount of space. A mega menu allows you to bulk add items to your menu.

For this tutorial we will be using the plugin Max Mega Menu found here:

https://wordpress.org/plugins/megamenu/

With the plugin installed and activated you will want to go to the Mega Menu section to go to the plugin’s settings. The default settings for most should work but you will normally need to update the colors of the menu. To do that you will go to Menu Themes, Menu Bar, and find the menu background settings.

You can use inspect element to determine the color of your current menu. If you do not know how to use Inspect element, we cover how to in our article:

http://www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site/

Don’t forget to save your changes to your Mega Menu settings and go to Appearance, Menus. Add some top-level menu items as you would normally add to your menu then click on the mega menu button that appears when you hover over a menu item. This will cause a new popup for editing the mega menu specific options.

In here you can add any WordPress widget that you would like to appear in your menu area. To modify the settings for a specific widget you would want to click the wrench icon in the top right of each widget.

Text version of this tutorial
http://www.wpbeginner.com/plugins/how-to-add-a-mega-menu-on-your-wordpress-site-step-by-step/

If you liked this video, then please Like and consider subscribing to our channel for more WordPress videos.

Check us out on Facebook
https://www.facebook.com/wpbeginner

Follow us on Twitter
http://twitter.com/wpbeginner

Check out our website for more WordPress Tutorials
http://www.wpbeginner.com
#WordPress #WordPressTutorial #WPBeginner

source

26 Comments

  • Unique Vision Academy Official on May 21, 2018

    Amazing

  • Great video

  • K R on May 25, 2018

    How to auto load next post.i have tired so many plugins but non of those worked.. please help

  • ᴛᴀᴍꜱʜɪ᭄kudla ff on May 26, 2018

    Please help me guys I need u r help please reply to my comment
    Contact me at mthamsheed@gmail.com

  • Michelle Pace on June 6, 2018

    Hi, sorry but I’m a bit lost with the end result. I was expecting to see a menu which looked a little like the Starbucks menu.

    Do those 3 pictures form the menu which displays when you click on on Home?

    And to get it working like the Starbucks menu do I rather select “flyout menu” and add a couple of navigation menu widgets rather?

  • Omar NGOM on August 21, 2018

    Hi ! i'm using Max Mega Menu but items on level 3 don't display correctly but when I fly over the elements with my mouse it display correctly. So i would like to display that correctly before i fly over how can i do ?

  • Qlive Keel on September 10, 2018

    THAT IS WHAT i SEEARCHED FOR!!!! THANK YOU

  • Bill Gannon on February 13, 2019

    I'm sorry. It looks like every other WordPress menu. Vanilla.

  • Landio on April 5, 2019

    Highly recomend to use Groovy mega menu. It literally took me like 15 minutes to figure out how it works and I was able to achieve a super nice menu on my site

  • Truck68 on April 13, 2019

    I created the Max mega menu widget, but then when I went to place that widget in my menu in the Mega menu standard layout mode, the widget was not available in from the big list of widgets at right.

  • Ed Benjamin on May 28, 2019

    I did not learn anything. thought this was supposed to be a beginner video. Now more colnfused than ever.

  • bqdstore on May 29, 2019

    Brilliant , now I have room on top Menu for all my directory categories!

  • StarMan on June 21, 2019

    She does know how it works

  • music4life17346 on February 14, 2020

    Does MegaMenu help with the menu layout? I have it right now and it's adding items the way that it wishes (i.e. filling the row and then continuing on the next line making it uneven) but is there a way i can divide the items to be equal amounts on the top row and bottom row?

  • Emma D'Aversa on February 29, 2020

    Hey, My wordpress isn't organized this way. I can't see the "appearence+" categorie in the left. Is it because I use the free version, or because they are changes since 2018? My wordpress look very limited comparated to yours.

  • Malay Gaherwar on March 23, 2020

    I have a doubt. Can all of this happen from a free website or is a personal/premium pack needed for this?

  • Krishan Kumar on March 28, 2020

    i have seen left side bar navigation menus in (w3school.com) in that website pages are switching dynamically without reloading..and side bar menu are sticky.
    is there anyway to create those menus in WordPress with elementor?

  • Klor Machinery on April 16, 2020

    what you showed would be the end result is nothing like what you actually demonstrated. now im even more lost. not cool.

  • Vega Services on April 21, 2020

    How can I remove search icon from menu bar.

  • Bob G. on May 2, 2020

    Very Good It has more in it, in under 4 min. than many of the long one with no mistakes. Very helpful.

  • Kurtikopter on May 17, 2020

    Doesnt work 🙁

  • santosh s on June 9, 2020

    Thanks a lot

  • Phil Langdon on July 12, 2020

    Superb. Clear just the right pace. Thank you

  • Arya Telavane on August 8, 2020

    Good video

  • Anymade Design on August 10, 2020

    Hi, could you please tell me how to create almost exact menu like the starbucks in this video have? I mean – Multiple rows with titles etc. Right now my menu shows in one row with almost 50 sub menu items. Do I need premium plugin for this? Thanks !

  • Michael Furlonger on October 9, 2021

    Is this using a paid mega menu? Also, has there been any changes from this to the 2021 plugin?

WhatsApp us
Live Chat

Office hours operation Mon-Sun 8:00 am ET – 4:00 pm ET

To start your Premium WP or Cpanel service, use our domain search engine, if the domain you want is available, contact us by Whats app to activate your project.

The easiest, fastest, and most secure way to communicate with us.
loading
Please enter your domain.
Please verify that you are not a robot.

Terms Privacy

 

 

error: WEBFINET SECURITY IS ON