Create Custom Navigation Menu in WordPress Themes

Create Custom Navigation Menu in WordPress Themes

By default, almost all WordPress blogs come with menus at traditional locations (top bar or side bars). Similarly, the structure and design of these menus follow a pretty standard pattern.

For many people, this default styling and design does not cut it. This is why there is a huge demand for custom navigation menus for WordPress themes. In this article, I will cover the easy way of adding and displaying custom navigation menus in WordPress themes.

Create Custom Navigation Menus

The first step in creating a custom WordPress navigation menu is to register the menu. To start with, add the following code to functions.php (located in the theme folder of your WordPress website):

This function comes with a long range of parameters that could be found at WordPress.org Codex. Here is a default list of available parameters:

At this point, go to the WordPress Admin > Appearance > Menus. Once there, either create or edit a new menu.

It often happens that a user needs to add additional navigation menu location. For this use the following code snippet:

Now that you have a new menu location, it is easy to add menu items. For this follow this great tutorial on adding and organizing custom menus.

Display Custom Navigation Menu

The custom navigation menu is ready for display. For this, add the code to the template file of the theme, at the location where you wish to display it.

Style the Menus

Styling the menu is a simple task. Add the following CSS class, .wpblog-menu-class (located inside the theme folder) for adding style to the menus:

Note: Best practice is to add above code in separate file.

Conclusion

In this tutorial, I have discussed how to create, style and display custom WordPress navigation menus for your website. Remember that you could add multiple menu locations for improving .website navigation. If you need help with the code, do leave a comment and I will get back to you.

WPblog

WP Blog is dedicated to getting you up and running
in the field of Wp blog wizardry - No Wands Involved!