Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

WordPress From Bootstrap to WordPress Setup a Bootstrap Theme Creating Bootstrap Navigation in WordPress

Posted by johnnewton3
johnnewton3
2,347 Points

New Menu Down Rather than Across

Creating Bootstrap Navigation in WordPress 9 Minutes : 30 Seconds into video. I am using, WordPress 4.2.2 Bootstrap v3.3.5

I entered the code as shown in the video at 9:30 but the menu is oriented downwards rather than across: Home Example Pages Blog

I researched wp_nav_menu in the codex and could find no argument for across vs down. Suggestions?

3 Answers

Ryan Hunt
Ryan Hunt
16,091 Points
Ryan Hunt
Ryan Hunt
16,091 Points

I just ran into the same problem and I think the thing that solved it for me was that I had written

'menu-class'

when it should be

'menu_class'

Hope that helps

Michael Hanna
Michael Hanna
17,649 Points
Michael Hanna
Michael Hanna
17,649 Points

Thanks, Ryan! I had made the same mistake. I would have found it eventually, but your comment here saved me a bunch of time.

Shaimoom Newaz
Shaimoom Newaz
7,219 Points

What a lifesaver!

Eric Atwell
Eric Atwell
13,837 Points
Eric Atwell
Eric Atwell
13,837 Points

This lesson shows that the property of "container" can be set to false. This seems to no longer be the case due to an update of bootstrap that was released after this lesson was made.

I set the 'container' to the value of 'ul' which took care of the vertical vs. horizontal nav links issue.

'container' => 'ul'

johnnewton3
johnnewton3
2,347 Points
johnnewton3
johnnewton3
2,347 Points

Additional research shows: menu-class 'nav navbar-nav' is not being given to the list items in the unordered list.

header.php>>>>> $args = array( 'menu' => 'header-menu', 'menu-class' => 'nav navbar-nav', 'container' => 'false' ); wp_nav_menu( $args );

page source>>>>> <ul id="menu-header-menu" class="menu"><li id="menu-item-13" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-4 current_page_item menu-item-13"><a href="http://localhost/atlas1/">Home</a></li>

I'm guessing that BS uses the 'nav navbar-nav' class id to format the menu horizontally.