How to Add wp MDBootstrap nav walker
Installation
Step:- 1class-wp-bootstrap-navwalker.php download to Click here
Step:- 2
Place class-wp-bootstrap-navwalker.php in your WordPress theme folder /wp-content/themes/your-theme/
Open your WordPress themes functions.php file - /wp-content/themes/your-theme/functions.php - and add the following code:
/**
* Register Custom Navigation Walker
*/
function register_navwalker(){
require_once get_template_directory() . '/class-wp-bootstrap-navwalker.php';
}
add_action( 'after_setup_theme', 'register_navwalker' );
Step:- 3
You will also need to declare a new menu in your functions.php file if one doesn't already exist.
register_nav_menus( array(
'primary' => __( 'Primary Menu', 'THEMENAME' ),
) );
Step:- 4
Add or update any wp_nav_menu() functions in your theme (often found in header.php) to use the new walker by adding a 'walker' item to the wp_nav_menu args array.
wp_nav_menu( array(
'theme_location' => 'primary',
'depth' => 2, // 1 = no dropdowns, 2 = with dropdowns.
'container' => 'div',
'container_class' => 'collapse navbar-collapse',
'container_id' => 'navbarRightAlignExample',
'menu_class' => 'navbar-nav ms-auto mb-2 mb-lg-0',
'fallback_cb' => 'WP_Bootstrap_Navwalker::fallback',
'walker' => new WP_Bootstrap_Navwalker(),
) );
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<!-- Container wrapper -->
<div class="container-fluid">
<a class="navbar-brand" href="#">Navbar</a>
<!-- Toggle button -->
<button
class="navbar-toggler"
type="button"
data-mdb-toggle="collapse"
data-mdb-target="#navbarRightAlignExample"
aria-controls="navbarRightAlignExample"
aria-expanded="false"
aria-label="<?php esc_attr_e( 'Toggle navigation', 'your-theme-slug' ); ?>"
>
<i class="fas fa-bars"></i>
</button>
<?php
wp_nav_menu( array(
'theme_location' => 'primary',
'depth' => 2,
'container' => 'div',
'container_class' => 'collapse navbar-collapse',
'container_id' => 'navbarRightAlignExample',
'menu_class' => 'navbar-nav ms-auto mb-2 mb-lg-0',
'fallback_cb' => 'WP_Bootstrap_Navwalker::fallback',
'walker' => new WP_Bootstrap_Navwalker(),
) );
?>
</div>
<!-- Container wrapper -->
</nav>
Installation is finished. If you get any problems and error. Please comments below
Post a Comment