0

how can I list the parent item with the child item in WP?

I use this:

function wpb_list_child_pages() {
    global $post;
    $parent = "";
    if ( is_page() && $post->post_parent ) {
        $childpages = wp_list_pages( 'sort_column=menu_order&title_li=&child_of=' . $post->post_parent . '&echo=0' );
        $parent =  get_the_title($post->post_parent);
    } else {
        $childpages = wp_list_pages( 'sort_column=menu_order&title_li=&child_of=' . $post->ID . '&echo=0' );

        $parent = $post->post_title;
    }
    if ( $childpages ) {
        $string = '<ul><li>' . $parent;
        $string .= '<ul>' . $childpages . '</ul>';
        $string .= '</li></ul>';
    }

    return $string;
}    
add_shortcode( 'wpb_childpages', 'wpb_list_child_pages' );

but I need this:

<ul>
<li><a href="#">PARENT ITEM</a></li>
<li><a href="#">CHILD ITEM 1</a></li>
<li><a href="#">CHILD ITEM 2</a></li>
<li><a href="#">CHILD ITEM 3</a></li>
<li><a href="#">CHILD ITEM 4</a></li>
</ul>
0
function wpb_list_child_pages() {
    global $post;
    $parent = "";
    if ( is_page() && $post->post_parent ) {
        $parent = wp_list_pages( 'title_li=&include=' . $post->post_parent . '&echo=0' );
        $childpages = wp_list_pages( 'sort_column=menu_order&title_li=&child_of=' . $post->post_parent . '&echo=0' );
    } else {
        $childpages = wp_list_pages( 'sort_column=menu_order&title_li=&child_of=' . $post->ID . '&echo=0' );
        //$parent = $post->post_title;
    }

    if ( $childpages ) {
        $string = '<ul>'. $parent . $childpages . '</ul>';
    }

    return $string;
}
add_shortcode( 'wpb_childpages', 'wpb_list_child_pages' );

OUTPUT ON TOP LEVEL PAGE

<ul>
    <li class="page_item page-item-283">
       <a href="http://192.168.8.200/www/parent-page/child-page-1/">Child Page 1</a>
    </li>


    <li class="page_item page-item-285">
       <a href="http://192.168.8.200/www/parent-page/child-page-2/">Child Page 2</a>
    </li>

    <li class="page_item page-item-286">
       <a href="http://192.168.8.200/www/parent-page/child-page-3/">Child Page 3</a>
    </li>

</ul>

OUTPUT ON A CHILD PAGE

<ul>

    <li class="page_item page-item-282 current_page_ancestor current_page_parent">
       <a href="http://192.168.8.200/www/parent-page/">Parent page</a>
    </li>

    <li class="page_item page-item-283 current_page_item">
       <a href="http://192.168.8.200/www/parent-page/child-page-1/" aria-current="page">Child Page 1</a>
    </li>

    <li class="page_item page-item-285">
       <a href="http://192.168.8.200/www/parent-page/child-page-2/">Child Page 2</a>
   </li>

   <li class="page_item page-item-286">
       <a href="http://192.168.8.200/www/parent-page/child-page-3/">Child Page 3</a>
   </li>

</ul>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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