As an advance Content Management System, WordPress not only provides web publishers tools to publish their content, but also the tools to make beautiful websites. With version 3.0, WordPress introduced a Menu Editor, which allowed theme developers to provide a user interface to create menus for their Themes. However, there are several things that this menu editor is not capable of. Customizing the look and feel of the Menus is also difficult for an average WordPress user. In this post we look at some plugins that extend the functionality of WordPress menus and allow website admins to create more innovative navigational menus on their websites.
WP UI – Tabs, Accordions, Sliders
WP UI plugin is an awesome free plugin that allows you to create tabs, spoilers, dialogues inside your posts and pages. It can also add feeds to any post or page. The plugin comes loaded with built in styles, themes, and documentation. I particularly loved the Spoilers or Collapsible thing which is very useful if you want to hide some particular portion of a post from user and let them decide if they want to see it. It can also be used to create lengthy articles with collapsed sections.
The plugin uses simple shortcodes which are well documented in the manual so there is a very little learning curve to it. This plugin is particularly useful for websites that write lengthy posts which follow a format. For example, a gadget review website can use the plugin to add tabs to their review posts. Even though the plugin has excellent documentation accessible from options page, the plugin author also has a support forum where users can ask questions.
- Creates tabs, spoilers, dialogues inside posts and pages.
- Comes with built in styles and themes that can be used.
- Easy to use shortcodes.
- Uses JQuery for UI, creating beautiful fadein and strike out effects.
- Comes with documentation and free support is available on plugin website.
JQuery Slick Menu Widget
Jquery Slick Menu Widget is a very basic and a very easy to use WordPress plugin, that allows you to add your Menus as tabs with slick animation to open and close them. It is called a widget because basically it is a Widget and you can add it into any widget area on your theme and configure the options how and where you would like it to appear. You can add multiple instances of this widget and create as many menus as you want.
While trying this Widget I tried to create a social media menu with links to my social web profiles. To do that I created a New Menu and gave it a name “SocialProfiles” then I added custom links to my social media profiles and saved the menu. Then in the Widget interface, I choose the menu, adjusted the alignment and offset before saving the widget. It worked like a charm. Then I went back to Menu Editor and created another tab for Categories adjusted the offset so that it appears below my Social Profiles tab.
- Displays your WordPress Menu in a slick jQuery tab.
- The sliding tab can be placed anywhere by adjusting offset and alignment in the Widget Configuration.
- You can add multiple instances of the widget to have more than one Slick tabs on your page.
- Comes with 12 different styles to choose from, users can also add their own styles if they want.
- Animation speed can be adjusted.
- The tab can be auto closed or have a close button for user to close it manually.
- The plugin is simple to use and awesome, however the author should consider extending it further by providing more animation options.
Fading Menu Plugin with Notification Bar and Social Icons
PremiumCoding’s WordPress Fading Menus Plugin allows you to create a navigational menu with fading effect and a notification bar. This plugin solves two problems with Menus that come with most themes. Firstly, it makes the menus more interesting, and secondly you can make navigational menus sticky. If used cleverly, a scrolling menu on top of the screen will increase your pageviews, create a better user experience, and will allow you to showcase your site in an interesting and easy to browse manner.
WordPress Fading Menus plugin uses the default WordPress menu system. This makes it easier for you to add Menu Items, or you can use existing menu to fade in once a user has scrolled your static menu on top. Techcrunch and many other popular websites use a fadein navigational menu on top.
- Uses WordPress Menu Editor to manage and edit menu items in your Fade in menu.
- User can select where they want the menu to appear top or bottom.
- Fully customizable appearance, website admins can create their own custom skins if they want or use the existing ones provided with the plugin.
- Choose fonts from Google Web Fonts API for a better typographic experience.
- Add a notification bar on top which could display either the latest tweet from a twitter account you describe in the settings, or add custom text with links.
- Add your own social media icons.
UberMenu WordPress Mega Menu Plugin
UberMenu is an awesome plugin to create and enhance your site’s Menu bar. It works well with existing WordPress menus that are enabled in your theme. It comes with many configuration options and allows you to create different type of Menus with highly customized submenus, and beautiful styles. Custom HTML, Images, descriptions, text and anything can be added to a menu item. This helps create rich sub-menus and enhanced user experience.
UberMenu uses responsive design which makes your menu fully compatible with different devices such as smart phones and tablets. It comes with 20 preset styles to choose from, you can also create your own style if you want. What I loved most about Ubermenu is that it can be used to create vertical as well as horizontal menus. Using vertical menu means you might have to alter your theme a bit, but if you can do that you can have a fantastic menu on the right making navigation different from most other sites and also fun. Ubemenu is also a very well documented plugin with support available on the developer website.
- Highly customizable and easy to configure.
- Requires WordPress Menu Enabled Theme.
- Responsive design approach makes UberMenu compatible with smart phones and ipad.
- 20 built in styles to get started, custom styles can also be added.
- Submenus can contain many different kind of menu items, have full width, multiple columns, images, custom html code, etc.
- Supports both vertical and horizontal menus.
- Menu can be placed on top or bottom of your page.
- Excellent cross browser support, works well with most modern browsers.
WordPress Sticky Menu Plugin
During last year or so many popular websites added a sticky top navigation to their interfaces. This navigation bar sticks to the top of the open webpage and makes it easier for users to browse different sections, search, subscribe and follow the website. WP Sticky menu provides a solution to create such menus for your website regardless of your theme.
WordPress Sticky Menu uses the WordPress custom menu system. This means you can create your menus in WordPress and configure the option for Sticky Menus in the option panel. It has a few built in styles, however you can create your own styles as well. The feature I liked the most is the ability to create the mega menu. A lot of links and useful information can be placed in the mega menu without affecting the user experience.
- Supports WordPress Menu Editor to create custom menus.
- Comes with 8 built in styles.
- Menus can be placed on top or bottom.
- Menu width is adjustable from options.
- Few built in animation effects to choose from.
Sticklr WP – Sticky Side Panel WordPress Plugin
Sticklr WP is a sticky side panel menu creating plugin. The inspiration for this plugin came from Envato websites. You can see similar side panels in action on codecanyon, themeforest and other envato websites or see it in action on the plugin website. Sticklr creates a jQuery + CSS based side panel menu which sticks to the side as users scroll down on a page. It is a powerful plugin with a very simple and easy to use admin interface. Each aspect of the side panel is easily customizable from admin menu. The panel comes with two default theme options light and dark, you can customize them or even create your own.
- Sticky sidebar panel inspired by Envato websites.
- An easy drag and drop interface to create your menu.
- You can use custom icons for each menu item.
- A menu item can be a navigational item, a custom link, a web form, or you can even add custom HTML.
- Size of the panel and menu items is adjustable.
- Comes with two light and dark themes, you can also create your own themes if you are good with CSS.
- Plugin configurations can be easily imported and exported.
The purpose of adding navigational menus is to make your website easier to navigate. The goal should be to make information you want to share quickly accessible. Since you can have a drop down menu does not mean that you should add all two hundred of your blog posts into a drop down menu. Use this space to share important and useful content on your website.