CODEWITHSUNDEEP
csswordpresstwitter-bootstrap
nellygrl
nellygrl

Reputation: 657

Make Wordpress Navbar Work With Bootstrap

I am currently trying to code a wordpress layout using Bootstrap 3.0. Right now I'm trying to get my nav bar to work. I found the NavWalker mod by TwitterM and followed his instructions and almost succeeded.

The problem is that the navbar isn't showing up as a one line bavbar. It's displaying each menu item on a new line.

Here's the code that I placed in my header after installing the walker mod (the code for that can be viewed here: http://twittem.github.io/wp-bootstrap-navwalker/):

    <div class="navbar">
        <?php
            wp_nav_menu( array(
            'menu' => 'primary_menu',
            'depth' => 2,
            'container' => false,
            'menu_class' => 'nav',
            'fallback_cb' => 'wp_page_menu',
            //Process nav menu using our custom nav walker
            'walker' => new wp_bootstrap_navwalker())
            );
        ?>
    </div>

A display of the issue is here on my site: http://noellesnotes.com/tester

If anyone has any suggestions, they would be GREATLY appreciated. Thanks for your time,

Noelle

Upvotes: 1

Views: 4168

Answers (3)

twittem
twittem

Reputation: 11

The walker does work with 3.0 the issue is that you must assign the menu to your given menu name in the WordPress admin. I am working to solve this in the main script but as long as it is assigned it will work just fine.

The issue is if a menu is not assigned in the admin it uses the wp_page_menu() fallback which does not support custom walkers.

-Edward (@twitem)

Upvotes: -1

Joel Wolfgang
Joel Wolfgang

Reputation: 21

This is pretty simple, but took me about an hour to figure out.

Just change your code to:

wp_nav_menu( array(
        'menu'            =>      'primary_menu',
        'depth'           =>      2,
        'container_class' =>      'nav-collapse collapse navbar-responsive-collapse',
        'menu_class'      =>      'nav navbar-nav',
        'fallback_cb'     =>      '',
        'menu_id'         =>      'main-menu',
        'walker'          =>      new twitter_bootstrap_nav_walker()
    ) ); ?>

Upvotes: 2

nellygrl
nellygrl

Reputation: 657

CeeJayOz figured out the anser to this problem. I needed to downgrade to Bootstrap version two and the mod worked.

Upvotes: 0

Related Questions