Create Pages Submenu in Header

Hi!

Add this to the functions.php file:

add_filter('avf_title_args', 'avf_title_args_mod', 10, 2); // remove default title
function avf_title_args_mod($args,$id)
{
	$av_sidebar_menu = avia_sidebar_menu(false);
	$args['html'] = "<div class='{class} title_container'><div class='container'><{heading} class='main-title entry-title'>{title}</{heading}>{additions}{$av_sidebar_menu}</div></div>";
    return $args;   
}

After that, add this to the Quick CSS field:

.title_container .widget_nav_menu {
  position: relative;
}

.title_container ul:first-child>.current-menu-item>a, .title_container ul:first-child>.current_page_item>a {
  padding: 3px 7px 7px 0;
}

#top .title_container .widget_nav_menu li {
  float: left;
  clear: none;
  margin: 0 5px;
}

Style the menu as you want.

Cheers!
Ismael

Hi!

Oh. Okay. I thought you want the default nested page navigation in the breadcrumb bar. Anyway, that kind of menu isn’t available by default. You can try the ubermenu plugin. Or use the Fullwidth Submenu Element but you will have to add it on every child pages.

Cheers!
Ismael

Hi!

The modifications above should do the trick. It will display all co-child pages of the current page.

Cheers!
Ismael

Hi!

Oh. Okay. So “Services” is not a page but a category. I’m sorry but there is no built in function to display the child of a category. Again, unfortunately, you might need to hire someone to build a custom function for it.

Regards,
Ismael

Hi!

OK. Do the modifications above then go to the child pages of the Services page. The menu should appear just below the title. On the portent.com site, when you click on the Services page, it goes directly to the SEO page which I believe is a child page of the Services page.

Regards,
Ismael

Hi!

It’s not working because the Page Sidebar Navigation option in the Sidebar Settings panel is disabled. Check one of the child the pages now: http://sonet.digital/about/team/

Sorry for the mess. The code is pretty basic and need additional modifications like conditional functions, css modifications etc. If you want to disable the default sidebar page navigation, add this in the Quick CSS field:

.sidebar nav.widget.widget_nav_menu {
  display: none;
}

You can contact codeable or hire a freelance developer to add the finishing touches.

Cheers!
Ismael

Hey!

The mega menu width is calculated dynamically via javascript to keep it full width. It will take a lot of css modifications to alter it.

Regards,
Ismael