I'm converting an html5 site into a wordpress theme, but have got stuck with my menus!
this is the html version:
And this is my result so far in wordpress:
as you can see I can't get the social menu inline with the main menu!
This is the function.php bit:
function register_my_menus() {
register_nav_menus(
array(
'header-menu' => __( 'Header Menu' ),
'top-left-menu' => __( 'Top Left Menu' ),
'social-menu' => __( 'Social Menu' )
)
);
}
add_action( 'init', 'register_my_menus' );
and this is the header.php bit:
<div class="navbar navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div><!--navbar-header-->
<?php
wp_nav_menu( array(
'theme_location' => 'top-left-menu',
'container' => 'nav',
'container_class' => 'navbar-collapse collapse dropdown',
'menu_class' => 'nav navbar-nav navbar-left',
'container_id' => 'cssmenu',
'walker' => new CSS_Menu_Walker()
)
);
?>
<?php
wp_nav_menu( array(
'theme_location' => 'social-menu',
'container' => 'nav',
'container_class' => 'navbar-collapse collapse',
'menu_class' => 'btn-group nav navbar-nav navbar-right'
)
);
?>
</div><!--container-->
</div><!--navbar-->
</div><!--navbar-wrapper-->
Is it possible to create these on the same line? In bootstrap it was a simple div with a navbar-left and navbar-right class, but I can't work it out in Wordpress!
Any help would be very gratefully recieved :D
I'm converting an html5 site into a wordpress theme, but have got stuck with my menus!
this is the html version:
And this is my result so far in wordpress:
as you can see I can't get the social menu inline with the main menu!
This is the function.php bit:
function register_my_menus() {
register_nav_menus(
array(
'header-menu' => __( 'Header Menu' ),
'top-left-menu' => __( 'Top Left Menu' ),
'social-menu' => __( 'Social Menu' )
)
);
}
add_action( 'init', 'register_my_menus' );
and this is the header.php bit:
<div class="navbar navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div><!--navbar-header-->
<?php
wp_nav_menu( array(
'theme_location' => 'top-left-menu',
'container' => 'nav',
'container_class' => 'navbar-collapse collapse dropdown',
'menu_class' => 'nav navbar-nav navbar-left',
'container_id' => 'cssmenu',
'walker' => new CSS_Menu_Walker()
)
);
?>
<?php
wp_nav_menu( array(
'theme_location' => 'social-menu',
'container' => 'nav',
'container_class' => 'navbar-collapse collapse',
'menu_class' => 'btn-group nav navbar-nav navbar-right'
)
);
?>
</div><!--container-->
</div><!--navbar-->
</div><!--navbar-wrapper-->
Is it possible to create these on the same line? In bootstrap it was a simple div with a navbar-left and navbar-right class, but I can't work it out in Wordpress!
Any help would be very gratefully recieved :D
Share Improve this question asked Dec 7, 2015 at 22:43 Benn MoffatBenn Moffat 531 gold badge2 silver badges6 bronze badges1 Answer
Reset to default 2Try setting 'container' => false, in the wp_nav_menu() options array and using your own HTML to wrap the output.
<div class="outer-container-whatever-bootstrap-classes">
<nav class="navbar-left other-classes">
<?php
wp_nav_menu( array( [your_options with 'container' => false,] ) )'
?>
</nav>
<nav class="navbar-right other-classes">
<?php
wp_nav_menu( array( [your_options with 'container' => false,] ) )'
?>
</nav>
</div>