WordPress Theme Development: Creating Custom Walker Nav Menus

Hey, guys!

What's going on over there?

This is Kimsea from basicblogtalk.com.

Welcome to lesson 4 or 3.1 of the WordPress development for beginners. This tutorial will teach you how to create Extends Walker Nav Menu to customize custom menus of your WordPress theme.

...but before I'm going to show you how to work with it, please lets me review the previous lesson and its issue.

Last week, in the previous lesson, you've learnt how to register the navigation menus. I used register_nav_menus to create menu manager for the backend users.

Also, the wp_nav_menu to display the menus where you want it to appear. At the meantime, I used some arguments of the wp_nav_menu to integrate the menus with bootstrap 3. As you can see, we've built 2 beautiful navigation menus in the frontend page of theme.

There is a problem, however, when I try to create child menu or submenu in the current displayed menus. The bootstrap framwork didn't regconize the submenu items of the WordPress HTML classes.

So, It made the navigation menus look pretty bad...

And the most terrible is, we cannot fix the problem using the wp_nav_menu function. It's the reason I come up with today tutorial: How to Create Extends Walker Nav Menu.

In the video, I will reveal how to make three walker classes for 3 different menu locations. So after finished the tutorial, you will be able to create some kind of these beautiful custom menus:

1) The dropdown menu on the top of your WordPress theme
2) The dropup menu at the buttom of the fotter of your theme
3) The popup overlap menu which appear when your clicked on the menu button

There we go then...

The resources for lesson 4 of the WordPress Development for Beginners.

1) WordPress Codex Refferences:
https://codex.wordpress.org/Class_Reference/Walker

2) Understanding The Walker Class of WordPress
https://code.tutsplus.com/tutorials/understanding-the-walker-class--wp-25401

https://github.com/davidwickman/extending-walker-child-only

3) Improve your WordPress Navigation Menu Output
http://www.kriesi.at/archives/improve-your-wordpress-navigation-menu-output

4) Bootstrap Walker Nav Menu Class
https://github.com/twittem/wp-bootstrap-navwalker

WordPress Theme Development With Bootstrap (promo code: UDEAFFAS419): http://bit.ly/2TWhFsw

=================================================================
Follow on social profiles
==================================================================

Facebook: https://facebook.com/kimseasok.writer

Twitter: https://twitter.com/kimseasok

LinkedIn: https://linkedin.com/in/kimseasok

Subscribe this YouTube channel for upcoming lesson:

Hashtags for the course:
#KimseaSok
#WordPressDevelopmenForBeginner
#WordPressThemeDevelopment
#PHPWordPress
#FreeWordPressDevelopmentCourse