How to develop a WordPress responsive bootstrap 3 menu

Hi, in this post I am going to show you how to create a WordPress bootstrap menu without using any plugin, for that follow the steps,
Step 1. Download the bootstrap nav walker file from GitHub following the link: https://github.com/wp-bootstrap/wp-bootstrap-navwalker/blob/master/wp-bootstrap-navwalker.php
Step 2. First, include the downloaded nav walker file placing into your theme folder
Step 3. Now declare a menu in functions.php for that you can go to our menu creation post.
Step 4. Now get the menu in frontend where you want to show the bootstrap menu for that you can go to our menu creation post

 '',
'container' => 'div',
'container_class' => '',
'container_id' => '',
'menu_class' => 'menu',
'menu_id' => '',
'echo' => true,
'fallback_cb' => 'wp_page_menu',
'before' => '',
'after' => '',
'link_before' => '',
'link_after' => '',
'items_wrap' => '

%3$s

', 'item_spacing' => 'preserve', 'depth' => 0, 'walker' => '', 'theme_location' => 'menu-id-tobe-fetched' ); //to display the menu wp_nav_menu( $args ); ?>

Step 5. Now replace the ‘walker’ => ”, to ‘walker’ => new WP_Bootstrap_Navwalker()

The code will look like

 '',
'container' => 'div',
'container_class' => '',
'container_id' => '',
'menu_class' => 'menu',
'menu_id' => '',
'echo' => true,
'fallback_cb' => 'wp_page_menu',
'before' => '',
'after' => '',
'link_before' => '',
'link_after' => '',
'items_wrap' => '

%3$s

', 'item_spacing' => 'preserve', 'depth' => 0, 'walker' => new WP_Bootstrap_Navwalker(), 'theme_location' => 'menu-id-tobe-fetched' ); //to display the menu wp_nav_menu( $args ); ?>

 

Now run the code and you have done,
In our next post, we will learn about the footer.php file of WordPress theme

Thanks for reading