How To Jazz Up Your WordPress Menu Using Plugins
A website’s main navigation menu is normally displayed in the website header, or at the top of the main sidebar. It is a vital component of your website design as visitors use this menu to navigate your website. The WordPress menu system also lets you add custom menus to widget areas such as your sidebar or footer. This is useful for adding additional menu areas to your website.
Most WordPress themes use a dropdown menu design for the main menu. They are simple, but functional. They can, however, be a little plain looking. Thankfully, the design of menus can easily be improved
I would like to show you a collection of WordPress plugins that will improve the design of your menus. Many of these plugins give better support for menus that are two or three levels deep. Some also add additional functionality such as the ability to add images and columns of content (these plugins are frequently referred to as Mega Menus).
* Note that all free WordPress plugins listed in this article have been tested and verified to be working with the latest version of WordPress.
Designed by Design Chemical, these plugins let you add stylish horizontal and vertical widgets to any widget area on your website. Dropdown levels can be selected by click or on hover; and there are fade and slide animations available.
Eight color schemes are available with the plugin, however you can use your theme’s default styling if you prefer. The plugins have not been updated since late 2012 but still work well with the latest version of WordPress.
Dropdown Menu Widget (FREE)
Dropdown Menu Widget is a versatile plugin that comes with 16 color schemes. Custom CSS can be defined if you prefer to create your own style. All animation effects and colors can be adjusted through the plugin settings area.
In addition to being able to insert a menu into a widget area, the plugin also provides you with the PHP code necessary to add it to your theme directly.
Responsive Menu (FREE)
Developed by Peter Featherstone, Responsive Menu is a fantastic plugin that will display a three lined menu symbol on mobile devices. It will also display naturally if you reduce the width of your browser. Once a visitor clicks on the menu button, your navigation menu will slide from the left or right (your choice!).
Every aspect of the menu can be modified via the settings area. You can change colors, font type, font size, and animation settings. You can also choose the width of your page in which the menu will display. The default setting is 600 pixels; which means that when the browser has a smaller resolution, the menu will be displayed.
Responsive Select Menu (FREE)
Another great responsive menu is available free from Seven Spark. Your normal navigation menu will be displayed when a visitor views your web page on a desktop, laptop, or landscape view on a tablet.
If the browser width is smaller than the size you define in the settings area, your menu will be replaced with a drop down menu. The plugin has a dedicated configurations page for integrating the plugin with UberMenu. You can also restrict the drop down menu to only be displayed on certain pages.
Another great plugin by Seven Spark, ShiftNav adds a touch enabled navigation bar to the top of your website. You can assign any WordPress menu to it.
It comes with a light and a dark scheme. Alternatively, you can use your own custom CSS or disable the theme skin altogether. Every aspect of the menu bar can be modified through the settings area. This includes colors, font size, text alignment, and the size of buttons.
With over 30,000 purchases on CodeCanyon, UberMenu can rightfully claim to be the most popular premium menu plugin available for WordPress. I purchased the plugin shortly after its release in 2011 and used it to improve the look of my blog’s main navigation menu.
It works right out of the box with the WordPress menu system and looks great on mobiles and tablets too. Pretty much anything can be integrated into vertical or horizontal menus including images, maps, icons, latest posts, contact forms, search bars, descriptions, and more. Over 20 styles are included with the plugin, however you can also change the style of menus yourself.
You should also check out Seven Spark’s other menu plugin Menu Management Enhancer if you need help managing large menus.
Mega Main Menu ($13)
Mega Main Menu is a stylish responsive navigation menu plugin that looks great on any device. A wide variety of content can be added to your menu including widgets, text, images, shortcodes, and more.
Unlimited colors can be chosen through the settings area. Over 600 Google fonts and 1,600 vector icons can also be selected.
WP Sticky Menu Plugin ($15)
Inspired by the design of Mashable, MashMenu is a stylish responsive menu that looks great on any device. It does not replace your existing menu, therefore you will need to edit your theme template and replace the default menu code with MashMenu.
The plugin lets you upload your own logo and define your own color scheme. Images are also loaded using lazy load so that the menu does not slow down your website.
Unfortunately, the developers will soon be removing this plugin and replacing it with another, however they still offer support to those who do purchase MashMenu in the meantime.
Kodda is a feature packed mega menu that comes with four unique skins and support for multiple columns. Links, text, images, videos, search bars, social media profile links, and more, can be added to your menu.
The plugin works out of the box with your existing WordPress menus and its responsive design ensures it looks great on any device. Menus can be organised easily using a user friendly drag and drop interface.
PBK Mega Menu ($8)
A mega menu plugin that comes with many different color schemes. It is one of the few menu plugins that uses the visual editor to style your menu.
You can add multiple columns to your drop down menus. Text, images, contact forms, videos, and more, can be added to your menus.
Stripe is a lightweight two level menu plugin that looks great on desktops and mobile devices. It displays icons for menu items, with the name of the menu item appearing once the user hovers it.
Over 350 icons are included with the plugin; therefore, you will have a lot of options on what icons to use for your menus. Colors can also be changed for icons, text labels, backgrounds, and dividers.
Mobile.Nav is a beautiful responsive menu solution for mobile devices. The menu will not appear on your desktop design, unless you reduce the width of your browser to a specified number of pixels.
Menus can be created through the WordPress menu system. Every background, border, and text color, can be changed through the settings area. Custom icons can also be assigned to menu items.
Iconize is an interesting plugin that lets you add icons to posts, pages, widget titles, menu items, and more. It is not technically a menu plugin; however it can be used to add beautiful icons to menus, therefore I thought many of you would be interested in it
The plugin comes packaged with a whopping 2,000 icons. Thankfully, you can search through this large list of icons by name. The size, color, and alignment of icons, can all be modified via the settings page. Icons can also be added into posts and pages via the visual editor.
Touchy is a beautiful mobile menu plugin that features an unlimited number of color schemes. A two level drop down accordion menu is displayed at the right hand side of the menu. Back, call, and email buttons, can also be displayed.
DH Menu ($12)
DH Menu is a responsive mega menu plugin that works separately from the WordPress menu system. Menus can be oriented horizontally or vertically and organised via a drop and drop interface.
It supports up to 12 columns in drop down menus and there are over 300 icons available. Every part of the menu style can be customised through a style editor in the settings area.
Wah-Menu is a responsive side menu that was designed specifically for iPads and other tablet devices. HTML, images, and videos, can all be added to your menu.
It comes in a light and dark color scheme. Over 750 font icons are available; including icons for Facebook, Google+, and Twitter.
Flexi Menu is a mega menu plugin that works with the WordPress menu system. It supports multiple columns, images, icons, and more. The color and style of your menus can be adjusted via the settings area. You can also define the width of drop down items.
Navigation Menu Widget is an affordable menu plugin that can be used for horizontal and vertical menus. The plugin lets you assign thumbnail images and icons to menu items. It also has support for shortcodes.
I hope you enjoyed this look at stylish menu plugins for WordPress. If so, I encourage you to subscribe to the Elegant Themes blog for updates of our latest articles.
If I have missed any good menu plugins from my list, please feel free to share them in the comment area below.
Article thumbnail image by JanPetrskovsky / shutterstock.com