Dropdown menu not working as expected

[philippbruhin]

First of all, thank you @MWDelaney and @jelovac for working on this project and sharing your knowledge with the world.

I am new to Roots Sage and I have not worked with WordPress for a while. For a new project, based on Bootstrap 4, I am trying to integrate this walker what went well via composer and the controller method.

What I do not understand yet is how to create a submenu. The dropdown-toggle class seems to be missing. Or should it be added manually? If so, I don’t know how. Could you help?

Following the class from the Bootsrap 4 docs:

[mantrone]

I've the same problem. Classes and attributes are missing on multiple elements. Without, i think that can't work it. Anyway inside bootstrap4-navwalker.php seems that logic exists, but it doesn't apply it.

[philippbruhin]

@mantrone I could make out afterwards the classes as well in bootstrap4-navwalker.php.

Since I was not able to get it run, I tried github.com/wp-bootstrap/wp-bootstrap-navwalker which works for me. Maybe this is an alternative for you as well?

[mantrone]

@philippbruhin Thank you for your help. I will try this solution. How did you implement wp-bootstrap-navwalker in your Roots Sage theme? Did you put class-wp-bootstrap-navwalker.php file in the App folder and invoke it in the array inside function.php?

[philippbruhin]

Exactly @mantrone I renamed the class to navwalker.php, and added namespace namespace App; and did place it in app/navwalker.php.

Furthermore I did extend app/Controllers/App.php with following code:

public function primarymenu() {
    $args = array(
    'theme_location'    => 'primary_navigation',
    'menu_class'        => 'navbar-nav mr-auto',
    'walker'            => new \App\navwalker(),
    );
    return $args;
}

resources/functions.php has to be extended as follows:

array_map(function ($file) use ($sage_error) {
    ...
    }
}, ['helpers', 'setup', 'filters', 'admin', 'navwalker']);

And resources/views/partials/header.blade.php looks as:

@if (has_nav_menu('primary_navigation'))
    <div id="primary_navigation_dropdown">
        {!! wp_nav_menu($primarymenu) !!}
    </div>  
@endif

Hope this helps.

[mantrone]

@philippbruhin this helped me a lot, but I see it can't handle the multilevel dropdown. Even changing the depth to 'depth' => 3 or more, it doesn't go beyond the first level. Have you ever dealt with this case?

[philippbruhin]

@mantrone good point. No, I haven't. For my current project 1st and 2nd level is ok. Nevertheless a solution that works for one level more would help. May this link can help?

[mantrone]

@philippbruhin the linked solution is not bad, but cover only the hover event (?). In addition I think understand that some changes should be made to the class-wp-bootstrap-navwalker.php. Not for the difficulty of these changes, but it doesn't sound like a best practice.

Seems strange that an example like this img attahed cannot be achieved, or at least not without difficulties. Anyway, thank you very much for your help.

[MWDelaney]

ONE MILLION YEARS LATER...

Bootstrap doesn't natively support more than a single level of dropdown, so this navwalker doesn't either. That's the scope I've decided on for the project. Sorry for the inconvenience!