Hi I am using wordpress and bootstrap, I want to add active class in wp_list_pages(), but I have tried many things all in vain, I need help.
I also used data-toggle=”pills” but stops all javascript
here is my navbar
<div class="navbar navbar-inverse navbar-fixed-top center">
<div class="navbar-inner">
<div class="container center">
<div class="nav-collapse collapse">
<ul class="nav" >
<?php wp_list_pages(array('title_li' => '')) ; ?>
</ul>
</div>
</div>
</div>
I notice you are using the old
wp_list_pages
function to create a navigation. I recommend you use the newerwp_nav_menu
which works almost the same, but better (even has fallback support forwp_list_pages
.Either way, what you are looking to add is a Walker to the array, just remember that in the walker you don’t pass a string, but an object.
I successfully added my WordPress and Bootstrap menu to work well like so:
Add this to your functions.php
I found how to do this from a gist that John Megahan has here.
Your PHP would look like this instead of
wp_list_pages
:Notice that I’m using the ‘menu’ and setting it to ‘main-menu’ (this is the name of my menu that I can manage through the WP dashboard). Check out the codex to see exactly what parameters you can pass on
wp_nav_menu
… but the bottom line here I think is that the Walker should help you extend to use the.active
class that Bootstrap uses.