Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Child-based secondary navigation WordPress

  • SOLVED

I need help creating a side navigation like the one here:

http://egr.vcu.edu/about/facilities/index.html

The function I have:

function bfg_secondary_nav() {

global $post;

$current_page_parent = ( $post->post_parent ? $post->post_parent : $post->ID ); ?>
<h3><a href="<?php echo get_permalink($current_page_parent); ?>"><?php echo get_the_title($current_page_parent); ?></a></h3>

<ul>
<?php wp_list_pages( array(
'title_li' => '',
'child_of' => $current_page_parent,
'depth' => '0' )
);

</ul>

<?php }

Almost works, but fails to display grandchildren properly. I'd prefer to use wp_nav_menu(); over wp_list_pages(); if possible.

Thanks!

2012-07-12 by royallds

Answers (2)

2012-07-12

Martin Pham answers:

try this

function bfg_secondary_nav() {
if(!is_page()) return;
$args = array(
'depth' => 0,
'date_format' => get_option('date_format'),
'child_of' => 0,
'title_li' => __('About'),
'echo' => 1,
'sort_column' => 'menu_order, post_title',
'post_type' => 'page'
);

wp_list_pages( $args );
}

CSS

.pagenav ul ul,
.pagenav .current_page_item ul ul,
.pagenav .current_page_ancestor ul ul,
.pagenav .current_page_ancestor .current_page_item ul ul,
.pagenav .current_page_ancestor .current_page_ancestor ul ul {
display: none;
}

.pagenav .current_page_item ul,
.pagenav .current_page_ancestor ul,
.pagenav .current_page_ancestor .current_page_item ul,
.pagenav .current_page_ancestor .current_page_ancestor ul,
.pagenav .current_page_ancestor .current_page_ancestor .current_page_item ul,
.pagenav .current_page_ancestor .current_page_ancestor .current_page_ancestor ul {
display: block;
}


More: http://codex.wordpress.org/Template_Tags/wp_list_pages#Markup_and_styling_of_page_items

royallds comments:

That displays all pages, not just the current page's siblings + children

Martin Pham comments:

@royallds: I checked and it displayed correctly