CODEWITHSUNDEEP
phpcsswordpressmenuitem
lowercase
lowercase

Reputation: 1220

Add Bootstrap class/style to Wordpress wp_list_pages menu items

I have some code that generates a sidebar menu on my Wordpress site as below...

<ul>
    <?php
    if($post->post_parent)
        $children = wp_list_pages("title_li=&sort_column=menu_order&child_of=".$post->post_parent."&echo=1");
    else
        $children = wp_list_pages("title_li=&child_of=".$post->ID."&echo=1");
        if ($children) { ?>
            <?php echo $children; ?>
        </div>
    <?php } ?>
</ul>

This outputs code in the following way...

<ul>
    <li class="page_item page-item-94 current_page_item"><a href="#">Menu Item</a></li>
</ul>

The problem is, I need it to use my Bootstrap 3 styles and output the list as below...

<div class="list-group submenu">
    <a href="#" class="list-group-item">Menu Item</a>
</div>

Basically I need to add the class of list-group-item to the a tag in the output list items. Is that at all possible?

Upvotes: 0

Views: 1122

Answers (2)

LoopCoder
LoopCoder

Reputation: 182

You can do this through jquery

$(document).ready(function(){
    $("ul").find("li").each(function(){
      $(this).addClass("YourClass");
    })
})

Upvotes: 1

Noman
Noman

Reputation: 4116

Your can your Walker Class to simply extend the output of wp_list_pages modify your $output put the Class in functions.php

class NS_CS_Walker extends Walker_page {
    function start_el( &$output, $page, $depth, $args, $current_page ) {
        if ( $depth ) {
            $indent = str_repeat( "\t", $depth );
        } else {
            $indent = '';
        }

        extract( $args, EXTR_SKIP );
        $output .= $indent . '<li><div>' . get_post_meta( $post_id, $key, $single ) . '</div></li>';
        // modify your output here

    } // End start_el
} // End Walker Class

Then your rendering code should be

$args = array(
    'walker'      => new NS_CS_Walker()
        // your extra $args would be here
);

wp_list_pages( $args );

Upvotes: 0

Related Questions