Ticket #9670: Display related menu items

Hi,
1.
I have the menu functioning how I want it on parent (1st level) and child pages (2nd level), except when the child has children (3rd level). When I am on a 2nd level page which has children or on a 3rd level page I want it to only display the menu which has the related 2nd level and its related children (3rd level). In addition to this I want a link that says, “Return to [Top Level Parent Page]”. You will see on my example page when you select “Meet Our Staff”, it has children so the menu should display “Meet Our Staff” and its children and a link to return to “Our School”. How do I configure this?

2.
Also, I want to remove the outside border (left, right, top bottom borer) from the very edges of the whole menu.

3.
I don’t want the 2nd level items indented

Can you please help?

thanks

OnPoint Plugins

2 years and 11 months ago

Good Morning Chris,

1.A. To customize the menu to display only the 2nd level item and it’s children when on a child page with children or a grandchild page, you may add the following filter to your active theme’s functions.php file.

/** * Use first level children as the top parent when on a child page, which has * children, or a grandchild page. * */ add_filter( 'advanced-sidebar-menu/menus/page/top-parent', function ( $top ) { if ( is_page() && has_post_parent( get_queried_object()->ID ) ) { if ( 0 < count( get_children( get_queried_object()->ID ) ) ) { return get_queried_object_id(); } return get_queried_object()->post_parent; } return $top; } );

1.B To add a custom “Return to <title>” link which points to the true top level parent, you may add the following filters to your active theme’s functions.php file.
Note: This will add the custom link at the beginning of the menu. Adding the link to the end of the menu would require a more complicated template override.

/** * Pass a flag via the wp_list_args arguments, so we know we are targeting * the correct level of the correct menus. * */ add_filter( 'advanced-sidebar-menu/list-pages/get-args', function ( $args, $level ) { if ( ! Advanced_Sidebar_Menu\Menus\Page::LEVEL_PARENT === $level ) { return $args; } $args['add_return_link'] = true; return $args; }, 10, 2 ); /** * Add a "Return to <title>" link to the beginning of the parent level * of the menu when on a child page with children, or a grandchild page. */ add_filter( 'wp_list_pages', function ( $html, $args ) { if ( is_page() && ! empty( $args['add_return_link'] ) ) { if ( has_post_parent( get_queried_object()->ID ) && ( 0 < count( get_children( get_queried_object()->ID ) ) || has_post_parent( get_queried_object()->post_parent ) ) ) { $parent = get_post_parent( $args['include'] ); $html = '<li class="page_item"><a href="' . get_permalink( $parent ) . '">Return to ' . get_the_title( $parent ) . '</a></li>' . $html; } } return $html; }, 10, 2 );

2. It looks you you’ve already figured this out, but for reference you may remove the borders by adding the following custom CSS.

#secondary #advanced_sidebar_menu-2-wrap > ul { border: 0px !important; }

3. You may remove the indenting by adding the following custom CSS.

div#advanced_sidebar_menu-2-wrap li li a { padding-left: 10px !important; } div#advanced_sidebar_menu-2-wrap li li li a { padding-left: 20px !important; }

Have a great day!

New Response Cancel reply