Pages Display Function
The ‘avp_get_pages()’ function recursively displays the current level of pages based on the parent page ID, starting from the first (parent) page level.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 | function avp_get_pages( $parent, $level ) { $pages = get_pages( array( ‘parent’ => $parent, ‘depth’ => 1, ‘sort_column’ => ‘menu_order’, ‘hierarchical’ => 0, ) ); if ( array() !== $pages ) { ?> <ul class=“page_item page_item_has_children” style=“list-style: none; display:<?php echo ( ( ( 2 >= $level ) ) ? ” : ‘none’ ); ?>;”> <?php foreach ( $pages as $page ) { echo ‘<li>’; if ( 0 < count( get_pages( array( ‘child_of’ => $page->ID, ‘depth’ => 1, ) ) ) ) { ?> <a href=“javascript:void(0);” style=“text-decoration: none;” class=“list-toggle” > <span class=“sitemap-index-span” style=“display:<?php echo ( ( ( 1 < $level ) ) ? ” : ‘none’ ); ?>;”>►</span> <span class=“sitemap-index-span” style=“display:<?php echo ( ( ( 1 >= $level ) ) ? ” : ‘none’ ); ?>;”>▼</span> </a> <?php } else { ?> <span class=“sitemap-index-span”>●</span> <?php } echo ‘<a href=“ ‘ . get_page_link( $page->ID ) . ’ ”>’ . $page->post_title . ‘</a>’; avp_get_pages( $page->ID, ( $level + 1 ) ); echo ‘</li>’; } ?> </ul> <?php } } |
The jQuery functionality does two things in this routine.
1 2 3 4 5 6 7 8 | jQuery(document).ready( function($) { jQuery( ‘a.list-toggle’ ).click( function() { jQuery(this).children(‘span’).toggle(); jQuery(this).next(‘a’).next(‘ul’).slideToggle(); }); }); |
First it toggles both of the <span> statements, which, since both are defined as being in an alternating display situation, always displays the opposite statement in alignment with whether the succeeding subpage list is displayed or hidden.
Second, it toggles the succeeding <ul> structure, being the subpage listing structure, hiding or displaying it upon command. The structure is originally displayed based on the depth of the subpages listed.
This is the same functionality as used for the Post display.
Style Sheet Functionality
1 2 3 4 5 | .sitemap-index-span { color: black !important; font-family: monospace; font-size: large; } |
The indicator icons are styled so that they better reflect the list bullets they are replacing.
This is the same functionality as used for the Post display.
Personal Links