Display sub menu links for WordPress parent pages that have child pages for navigation that duplicates links in main menu pull downs

If you are looking for a way to deliver child pages that will continue with the navigation from their parents’  and duplicate the links that are in the pull down menus for such pages, look no further.  This is the actual function for a shortcode which can be added called “[sub_menu_links]” which you could then loop through and embed all links to the sub-menu of the children of the parent page this shortcode was embedded in.

It’s useful, especially for tablets and smart phones where you need to duplicate navigation, or re-use navigation possibly in a different way to make the page more user friendly.  I often embed this shortcode in landing pages and it will display tabs instead of buttons of certain pages to help users visualize where they are in the website and what options are available to them without having to scroll up on small screens to tap the menu to see the child options.

/* Shows sub-menu of landing pages as links in the page
*
**/

// add hook
add_filter( ‘wp_nav_menu_objects’, ‘my_wp_nav_menu_objects_sub_menu’, 10, 2 );

// filter_hook function to react on sub_menu flag
function my_wp_nav_menu_objects_sub_menu( $sorted_menu_items, $args ) {

if ( isset( $args->sub_menu ) ) {
$root_id = 0;

// find the current menu item
foreach ( $sorted_menu_items as $menu_item ) {

if ( $menu_item->current ) {
// set the root id based on whether the current menu item has a parent or not
$root_id = ( $menu_item->menu_item_parent ) ? $menu_item->menu_item_parent : $menu_item->ID;
break;
}
}

// find the top level parent
if ( ! isset( $args->direct_parent ) ) {
$prev_root_id = $root_id;

// loop

while ( $prev_root_id != 0 ) {
foreach ( $sorted_menu_items as $menu_item ) {
if ( $menu_item->ID == $prev_root_id ) {
$prev_root_id = $menu_item->menu_item_parent;

// don’t set the root_id to 0 if we’ve reached the top of the menu
if ( $prev_root_id != 0 ) $root_id = $menu_item->menu_item_parent;
break;
}
}
}
}

$menu_item_parents = array();
foreach ( $sorted_menu_items as $key => $item ) {
// init menu_item_parents
if ( $item->ID == $root_id ) $menu_item_parents[] = $item->ID;

if ( in_array( $item->menu_item_parent, $menu_item_parents ) ) {
// part of sub-tree: keep!
$menu_item_parents[] = $item->ID;
} else {
// not part of sub-tree: away with it!
unset( $sorted_menu_items[$key] );
}
}

return $sorted_menu_items;
} else {
return $sorted_menu_items;
}
}

wp_nav_menu( array(
‘theme_location’ => ‘primary’,
‘sub_menu’ => true,
‘items_wrap’ => ‘%3$s’,
‘depth’=>’-1′
) );

About Author:

Senior Cloud Software Engineer and 25+ years experienced video production, video editing and 3D animation services for a variety of global clients including local video production here in Jacksonville, Florida.

1 thought on “Display sub menu links for WordPress parent pages that have child pages for navigation that duplicates links in main menu pull downs

  1. Excellent website you have here but I was curious about if you knew of any discussion boards that cover the same topics discussed here? I’d really love to be a part of community where I can get responses from other experienced people that share the same interest. If you have any recommendations, please let me know. Kudos!

Leave a Comment

Your email address will not be published. Required fields are marked *