Not able to link to top level page when there a second level pages

[Katie H]

Hi, when a page has second level pages underneath the top level page does not have an active link. The top level page is still accessible directly (if you know the url), but it is not an active link.

[catchfire]

I tried looking into this last week for a project, and I think it's more a funciton of the wp_bootstrap_navwalker.php script that is included in the package. I wasn't able to find a solution to my liking in the time I had so we just have the content fit those restrictions. If it's critical you could code out the menu by hand which would give you more individual control on link behavior but you'd lose Admin Panel integration by doing so.

[Marco van der Ziel]

I also have problems with non-active links. When a link has children it becomes inactive. Is there a fix for wp_bootstrap_navwalker.php to make al menu-items active?

[Jonath Lee Eng Sing]

This is due to Bootstrap's Click to drop menu feature. For anyone who would like to have parent button click-able, you may consider other navigation menu plugins e.g. superfish, flexnav or etc.

They can be configured to with current page parent class with css classes as well.

See one of my example > http://www.mycrop.com.my/inter-in-field/

[Marco van der Ziel]

Good idea. Did you implemented Superfish manually or with a WordPress plugin?

[Jonath Lee Eng Sing]

Manually, this is due to Responsive compatibility issue. You can try to view it in mobile mode to see how it works.

[Marco van der Ziel]

I implemented Flexnav, it works fine. Many thanks for your advise.

[Jonath Lee Eng Sing]

Congrats on the solution. No need to thank me since I didn't help much.
:)

[kskonovalov]

Sorry for necro post, but could be useful:

If somebody want a "hotfix" for menu, i did this to make it work on hover:

1. /inc/wp_bootstrap_navwalker.php line ~66
   change from
   if ( $args->has_children ) { $atts['href'] = '#';
   to
   if ( $args->has_children ) { $atts['href'] = ! empty( $item->url ) ? $item->url : '#';
2. add to your theme custom js file:
   jQuery(document).ready(function($) { $(".navbar-collapse").find("li.dropdown").each(function(){ $(this).on("mouseover", function () { $(this).addClass("show"); $(this).find("a").attr("aria-expanded", "true"); $(this).find(".dropdown-menu").addClass("show"); }); $(this).on("mouseout", function () { $(this).removeClass("show"); $(this).find("a").attr("aria-expanded", "false"); $(this).find(".dropdown-menu").removeClass("show"); }); $(this).on("click", function () { var url = $(this).find("a").attr("href"); if(url != "#") { window.location.href = url; } }) }); });

That's all. Also maybe fix the styles to make drop-down menu work on mobile, smth like that:
@media screen and (max-device-width: 699px) { .navbar-nav .dropdown-menu { display: block; } .collapse.show { background: #fff; padding: 0 0 20px 0; } }