At http://tinyurl.com/7f2t7mw you see the parent menu selected in the horizontal navbar. That I have already working. I need a sidebar like they do with the same parent indicated plus children when there are. At the moment I have some great code thanks to Michael's feedback at WordPres Stack Exchange on an earlier question here. But that code does not show the parent above the children pages nor children pages above the siblings. Any ideas how can I adjust this code made by Michael:
<?php
$children = wp_list_pages('title_li=&child_of='.$post->ID.'&echo=0&depth=2');
if ($children) { ?>
<ul id="three-menu">
<?php echo $children; ?>
</ul>
<?php } //ends (if($children)//
elseif($post->post_parent) { //if no children, try to get parent page and show siblings pages including the page itself
$siblings = wp_list_pages('title_li=&child_of='.$post->post_parent.'&echo=0&depth=1');
if ($siblings) { ?>
<ul id="three-menu">
<?php echo $siblings; ?>
</ul>
<?php } //ends if($siblings)// ?>
<?php } else { //optional: if no children and if no parent, then show all top level pages
$pagelist = wp_list_pages('title_li=&echo=0&depth=1');
if ($pagelist) { ?>
<ul id="three-menu">
<?php echo $pagelist; ?>
</ul>
<?php } //ends if($pagelist)// ?>
<?php } ?>
The WordPress Codex page http://codex.wordpress.org/Function_Reference/wp_list_pages#List_current_Page_with_its_ancestors_and_children seems interesting, but I have not figured it all out just yet..
Update:
Added depth two to children if (first if statement) and that helps loading the children and siblings at a permalink level like: http://domain.com/top-level-page/. Just need to do some styling. But now I need to rework the next to levels.
Update 2 CSS Solution
With some help I do have a menu that works quite well using wep_list_pages and some CSS. This is basically a CSS solution.
<div id="home-menu">
<div class="wplp_menu">
<ul id="top-level-sidebar">
<?php wp_list_pages('title_li='); ?>
</ul>
</div>
</div>
and CSS:
li.current-page-ancestor a, li.current-menu-item a
{
color:#146BBB; //#0D55A8;
}
ul.children .current_page_item a:link,
ul.children .current_page_item a:visited {
background-color:#CCCCCC;
width: 250px;
}
.wplp_menu li{
list-style:none; /*blends out list dots,can be removed if done somewhere else*/
}
ul#top-level-sidebar {
background: #5097EA;
width: 300px;
margin: 0 10px 0 50px;
float: left;
}
.wplp_menu .page_item a {
display:none;
}
.wplp_menu .current_page_ancestor a,.wplp_menu .children .current_page_item a,.wplp_menu .current_page_item li a {
display:block;
}
.current_page_item a { /* CSS for active item*/
font-weight:bold;
}
.current_page_item li a {
font-weight:normal; /* Resets the above for its children */
}
wp_nav_menu()for this? – Mamaduka Mar 18 '12 at 10:15wp_list_pagesHow would I do that usingwp_nav_menu()? – rhand Mar 18 '12 at 10:32wp_nav_menuagain of course and see how I can convert all the added code plus make changes to make it look like the sidebar on the mentioned site. – rhand Mar 19 '12 at 10:37