WordPress wp_list_pages highlight current page

I using this:

<ul>
    <?php wp_list_pages("&post_type=projects&child_of=$parent_page&title_li="); ?>
</ul>

To get that:

Read More
<ul>
    <li class="page_item page-item-588"><a href="#" title="One">One</a></li>
    <li class="page_item page-item-592"><a href="#" title="Two">Two</a></li>
    <li class="page_item page-item-599"><a href="#" title="Three">Three</a></li>
</ul>

First code should display list of child pages.
Everything is fine, But i faced with some problem. If i used custom post type (like projects in example), WordPress 3.2.1 can’t add “current” class to <LI> and i can’t highlight random opened current page.

functions.php

add_action( 'init', 'register_cpt_projects' );
    function register_cpt_projects() {
    $labels = array(
    'name' => _x( 'Проекты', 'projects' ),
    'singular_name' => _x( 'Проект', 'projects' ),
    'add_new' => _x( 'Добавить', 'projects' ),
    'add_new_item' => _x( 'Добавить проект', 'projects' ),
    'edit_item' => _x( 'Изменить', 'projects' ),
    'new_item' => _x( 'Новый Проект', 'projects' ),
    'view_item' => _x( 'Просмотреть', 'projects' ),
    'search_items' => _x( 'Поиск проектов', 'projects' ),
    'not_found' => _x( 'Ничего не найдено', 'projects' ),
    'not_found_in_trash' => _x( 'Ничего не найдень в корзине', 'projects' ),
    'parent_item_colon' => _x( 'Родительский Проект:', 'projects' ),
    'menu_name' => _x( 'Проекты', 'projects' ),
    );
    $args = array(
    'labels' => $labels,
    'hierarchical' => true,
    'supports' => array( 'title', 'editor', 'thumbnail', 'custom-fields', 'post-formats', 'page-attributes' ),
    'public' => true,
    'show_ui' => true,
    'show_in_menu' => true,
    'menu_position' => 5,
    'show_in_nav_menus' => true,
    'publicly_queryable' => true,
    'exclude_from_search' => false,
    'has_archive' => false,
    'query_var' => true,
    'can_export' => true,
    'rewrite' => true,
    'capability_type' => 'page'
    );
    register_post_type( 'projects', $args );
};

variable
$parent_page:

   // get_top_parent_page_id
    function get_top_parent_page_id($id) {
        global $post;
        if ($post->ancestors) {
            return end($post->ancestors);
        } else {
            return $post->ID;
        }
    };

Please Help!

Related posts

Leave a Reply

5 comments

  1. I think the best way will be to consider using wp_nav_menu instead of wp_list_pages – it is much more flexible solution and can do what you want. You’ll have to sync the menu with the list of your pages, but it can be done automatically using actions.

  2. Solve it with no pain and just body class 🙂

    In functions.php:

    function get_id_outside_loop() {
        global $wp_query;
        $thePostID = $wp_query->post->ID;
        return $thePostID;
    }
    

    In header.php:

    <body class="<?php echo get_id_outside_loop(); ?>">
    

    In <head> sections or in footer.php:

    <STYLE>
    <!--
    body.<?php echo get_id_outside_loop(); ?> .project_pages ul li.page-item-<?php echo get_id_outside_loop(); ?> 
    {
      background: #0096f4; /* Highlight */
    }
    -->
    </STYLE> 
    

    Have a nice day!

  3. You need to add this to your functions.php:

    function kct_page_css_class( $css_class, $page, $depth, $args, $current_page ) {
      if ( !isset($args['post_type']) || !is_singular($args['post_type']) )
        return $css_class;
    
      global $post;
      $current_page  = $post->ID;
      $_current_page = $post;
      _get_post_ancestors($_current_page);
    
      if ( isset($_current_page->ancestors) && in_array($page->ID, (array) $_current_page->ancestors) )
        $css_class[] = 'current_page_ancestor';
      if ( $page->ID == $current_page )
        $css_class[] = 'current_page_item';
      elseif ( $_current_page && $page->ID == $_current_page->post_parent )
        $css_class[] = 'current_page_parent';
    
      return $css_class;
    }
    add_filter( 'page_css_class', 'kct_page_css_class', 10, 5 );
    

    Via http://kucrut.org/wp_list_pages-for-custom-post-types/