logo
Ask your WordPress questions! Pay money and get answers fast! (more info)

Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

If the asker does not get an answer then they have 10 days to request a refund.

$6
Display menu/list and show child pages only when on parent/child

I need to display a list of all pages in my sidebar. The pages go 3 levels deep. I need to show the child pages only when on the parent or another child of that parent. This needs to work for all levels.

Is there an easy way of doing this with wp_nav_menu or should I use wp_list_pages and some sort of tree function?

Can anyone point me in the right direction, or provide block of code I can use for this?

This question has been answered.

Dan | gteh | 05/16/12 at 10:46pm Edit


(4) Possible Answers Submitted...

See a chronological view of answers?

Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

  • avatar
    Last edited:
    05/16/12
    11:06pm
    Nilesh shiragave says:

    You want to display all pages? or just child pages of the current page? or if childs are not present then display all the top level pages?


    <?php if($post->post_parent): ?>

    <?php $links= $sidelinks = wp_list_pages("title_li=&echo=0&depth=1&child_of=".$post->post_parent);

    $title=get_the_title($post->post_parent);

    ?>

    <?php else: ?>

    <?php $links= $sidelinks = wp_list_pages("title_li=&echo=0&depth=1&child_of=".$post->ID);

    $title=get_the_title($post->ID);

    ?>

    <?php endif; ?>

    <h2 class="widget_heading"><?php echo $title; ?></h2>

    <ul>

    <?php echo $links; ?>

    </ul>


    You can try above code.

    • 05/16/12 11:15pm

      Dan | gteh says:

      Yup, that sounds about right.

      I'll give this a shot soon and let you know.

  • avatar
    Last edited:
    05/16/12
    11:16pm
    Jeffri Hong says:

    Hello.

    The easiest way I can think of is to use wp_list_pages and then use CSS to display current sub-pages. When you are on the parent page, the class "current_page_item" is added to the link. On the sub-page, "current_page_parent" and "current_page_ancestor" is added to the parent page link.

    So basically, you hide every sub-page by default, and only display the sub-pages which the parent have any of those classes. An example of the CSS:

    #navigation ul ul { display: none; }
    #navigation ul li.current_page_item ul, #navigation ul li.current_page_parent ul, #navigation ul li.current_page_ancestor ul { display: block; }


    * Change #navigation to the wrapper id/class

    If you have a lot of sub-pages this solution might not be pratical as all links are actually send out to the browser, but hidden. If there is not a lot, it is the easiest.

    Hope that help.

    Jeffri

    • 05/16/12 11:28pm

      Dan | gteh says:

      thanks for this suggestion. this might work also. I'll let you both know soon.

    • 05/19/12 3:15am

      Dan | gteh says:

      Your suggestion pointed me in the right direction. thanks.

      This is what I ended up doing because the nav menu is 3 levels deep on some links.


      #sidebar-left ul ul {display:none;}
      #sidebar-left ul ul ul {display:none;}

      #sidebar-left ul .current-menu-item > ul {display:block;}
      #sidebar-left ul .current_page_ancestor ul {display:block;}

    • 05/19/12 3:18am

      Dan | gteh says:

      Just a note that your strategy works with wp_nav_menu also which is what I needed to use

  • avatar
    Last edited:
    05/17/12
    1:43am
    Arnav Joy says:

    try this

    <ul id="list">
    <?php
    $pageID = get_pages('child_of=0&parent=0');
    foreach ($pageID as $pagg) {
    echo ' <li><span>'.$pagg->post_title.'</span>';
    if(get_the_ID() == $pagg->ID){
    $pageID1=get_pages('child_of='.$pagg->ID.'&parent='.$pagg->ID);
    echo '<ul>';
    foreach ($pageID1 as $pagg1) {
    echo ' <li><a href="'.get_page_link($pagg1->ID).'">'.$pagg1->post_title.'</a></li>';
    }
    echo '</ul>';
    }
    }
    ?>
    </ul>

  • avatar
    Last edited:
    05/17/12
    11:25am
    Michael Caputo says:

    This is how i've done it in the past (if i'm understanding you correctly):



    <?php
    $page_id = $post->ID;
    $args = array(
    'depth' => 2,
    'child_of' => $page_id,
    'echo' => 0,
    'sort_column' => 'menu_order',
    'title_li' => ''
    );
    $list_of_pages = wp_list_pages( $args );

    if ($list_of_pages == '') { ?>
    <div class="widget" id="subpageNavigationWidget">
    <div class="widgetHolder">
    <nav>
    <ul class="sectionNavigation-list" id="sideAccor">
    <li class="page_item" style="border-bottom:1px dotted #006A3C;"><a href="javascript:history.go(-1)">GO BACK</a></li>
    </ul>
    </nav>
    </div>
    </div>
    <?php } else { ?>
    <div class="widget" id="subpageNavigationWidget">
    <div class="widgetHolder">
    <nav>
    <ul class="sectionNavigation-list" id="sideAccor">
    <?php
    echo $list_of_pages;
    ?>
    </ul>
    </nav>
    </div>
    </div>
    <?php } ?>

    • 05/19/12 3:14am

      Dan | gteh says:

      That could work but I'd prefer not to use wp_list_pages. I need the control of wp_nav_menu so that the menu items use different titles than the posts.

This question has expired.



Gabriel Reguly, Dan | gteh voted on this question.



Current status of this question: Completed



Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

If the asker does not get an answer then they have 10 days to request a refund.