Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I just want to add a class for the active page in the wp_list_pages().Is it possible? If so can I provide a particular class for a active page. Here is my code for listing the parent page and its sub page.

       <?php



$output = wp_list_pages('echo=0&depth=1&title_li= &sort_column=menu_order' );
if (is_page( )) {
  $page = $post->ID;
  if ($post->post_parent) {
    $page = $post->post_parent;
  }

  $children=wp_list_pages( 'echo=0&depth=1&child_of=' . $page . '&title_li=&sort_column=menu_order' );
  if ($children) {
    $output = wp_list_pages ('echo=0&depth=1&child_of=' . $page . '&title_li= &sort_column=menu_order');
  }
}
?>
 <li><a href="<?php echo get_permalink( $post->post_parent ); ?>" class="active">Home</a></li>
<?php 
echo $output;


              ?>

Please help me.I want add the class name "active" to the active page in the wp_list_pages(). For example I want to display my WP pages as follows.If 1 select the sub page 3 I want to add the class active only to that particular page

<div class="page-menu">
                <ul>                    
                    <li><a href="#" title="">Home</a></li>
                    <li><a href="#" title="">1</a></li>
                    <li><a href="#" title="">2</a></li>
                    <li><a href="#" title="" class="active">3</a></li>
                    <li><a href="#" title="">4</a></li>
                    <li><a href="3" title="">5</a></li>
                </ul>
            </div>
share|improve this question
    
Please reformat your code. The Q/A in here is a reference for later users who face the same problem as well. Thanks. –  kaiser Sep 9 '13 at 12:56

2 Answers 2

up vote 0 down vote accepted

Problem solved..

I just add the css like as follows and it solve the my problem.

.page-menu ul li.current_page_item a{
    background-color:#445C1C;
    }

For adding the class for parent page I have used the following code

 <li><a href="<?php echo get_permalink( $post->post_parent ); ?>" <?php if(is_page($post->post_parent )) {?> class="active" <?php }?>>Home</a></li>

Hope this may help somebody in future who is facing the same problem, that I have faced :)

share|improve this answer

As wp_list_pages() has an argument of walker, you can use that to replace what is being used by walk_page_tree() as walker class internally.

@Brady has left a nice example in this answer.

class WPSE113482PageWalker extends Walker_Page
{
    function start_el( &$output, $page, $depth, $args, $current_page )
    {
        // Build $output here and apply your class for the active item
    }
}

You might also want to consider using wp_page_menu().

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.