Making wp_nav_menu work with Bootstrap 3 navbar

Notice! This only works with single level navigation. If your nav needs a dropdown, follow this tutorial which uses a custom nav walker. If you’re using a single level nav, this will do the trick.

I’m currently re-designing my homepage functionally and aesthetically and I wanted to use the Bootstrap 3 navbar on the re-design. After wrestling with the code for a little bit, I finally got it to work.

The following is in header.php

Leave any questions in the comments below.

Join the Conversation


    1. You are correct, this solution only works for single level navs. If you’d like something that works with multi-level navs check out the link at the top of the post. I’ve tried it and it does work.

  1. I’m having issues with the implementation of this – the container_class and container_id are not being applied at all, and the containing div that should have the class and ID applied are picking up the classes of “nav navbar-nav” intended for the .

    Any ideas what may have gone wrong? I’ve applied this code straight after the opening tag and can’t see what the issue might be?

    1. I’ve seen some weird behavior if the menu you’re trying to use isn’t set as your “primary” menu in the Menus section of the dashboard. Try changing that and see if it helps. If it doesn’t work let me know and I can look into it further.

Leave a comment

What do you think?

%d bloggers like this: