Home  • Framework • Wordpress

Wordpress wp_nav_menu function parameters for bootstrap integration

Step 1 Download wp_bootstrap_navwalker.php file from Download
16 kb
and unzip it. Step 2 copy it to your theme folder. Step 3 Open functions.php file and write the following code.
<?php
  require_once('wp_bootstrap_navwalker.php');
?>
Step 4 write the following code where you want to see the navigation menu. ideally in header.php or index.php file.
 <nav id="nav" class="navbar navbar-default" role="navigation">
	<!-- Brand and toggle get grouped for better mobile display -->
	<div class="navbar-header visible-xs">
		<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
			<span class="sr-only">Toggle navigation</span>
			<span class="icon-bar"></span>
			<span class="icon-bar"></span>
			<span class="icon-bar"></span>
		</button>
		<a class="navbar-brand" href="#"><img src="<?php echo THEME_URI?>/screenshot.png" width="50" /></a><?php bloginfo('name'); ?>
	</div>
 
	<!-- Collect the nav links, forms, and other content for toggling -->
	
	
		<?php
		/*
            wp_nav_menu( array(
                'menu'              => 'primary',
                'theme_location'    => 'primary',
                'depth'             => 2,
                'container'         => 'div',
                'container_class'   => 'collapse navbar-collapse',
				'container_id'      => 'bs-example-navbar-collapse-1',
                'menu_class'        => 'nav navbar-nav',
                'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
                'walker'            => new wp_bootstrap_navwalker()
				)
            );
			*/
        ?>
		
		<?php 
              
               wp_nav_menu( array( 
		'theme_location' 	=> 'primary',
		'container' 	 	=> 'div',
		'container_class' 	=> 'collapse navbar-collapse',
		'container_id'    	=> 'main-navbar-collapse',
		'menu_class'      	=> 'nav navbar-nav',
		'menu_id'         	=> '',
		'echo'            	=> true,
		'fallback_cb'     	=> 'wp_page_menu',
		'before'          	=> '',
		'after'           	=> '',
		'link_before'     	=> '',
		'link_after'      	=> '',
		'items_wrap'      	=> '<ul id="%1$s" class="%2$s">%3$s</ul>',
		'depth'           	=> 2,
		'walker'          	=> new wp_bootstrap_navwalker()
    )); ?>
	
	
 </nav>

Comments 1


https://codex.wordpress.org/Class_Reference/Walker

Share

Copyright © 2024. Powered by Intellect Software Ltd