WP Bootstrap Navwalker not displaying ‘current-menu-item’ class

Question

Here’s how my output HTML

    <!-- Navigation -->
    <header class="nav">
        <div class="nav__holder nav--sticky">
            <div class="container-fluid nav__container nav__container--side-padding">
                <div class="flex-parent">

                    <div class="nav__header">
                        <!-- Logo -->
                        <a href="index.html" class="logo-container flex-child">
                            <img class="logo" src="#">
                        </a>

                        <!-- Mobile toggle -->
                        <button type="button" class="nav__icon-toggle" id="nav__icon-toggle" data-toggle="collapse" data-target="#navbar-collapse">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="nav__icon-toggle-bar"></span>
                            <span class="nav__icon-toggle-bar"></span>
                            <span class="nav__icon-toggle-bar"></span>
                        </button>
                    </div>

                    <!-- Navbar -->
                    <nav id="navbar-collapse" class="nav__wrap collapse navbar-collapse">
                        <ul class="nav__menu">
                            <li class="nav__dropdown active">
                                <a href="index.html" aria-haspopup="true">item</a>
                                <i class="ui-arrow-down nav__dropdown-trigger" role="button" aria-haspopup="true" aria-expanded="false"></i>
                                <ul class="nav__dropdown-menu">
                                    <li><a href="#">item</a></li>
                                    <li><a href="#">item</a></li>
                                    <li><a href="#">item</a></li>
                                    <li><a href="#">item</a></li>
                                </ul>
                            </li>
                            <li class="nav__dropdown">
                                <a href="#" aria-haspopup="true">item</a>
                            </li>
                            <li class="nav__dropdown">
                                <a href="#" aria-haspopup="true">item</a>
                                <i class="ui-arrow-down nav__dropdown-trigger" role="button" aria-haspopup="true" aria-expanded="false"></i>
                                <ul class="nav__dropdown-menu">
                                    <li><a href="#">item</a></li>
                                    <li><a href="#">item</a></li>
                                    <li><a href="#">item</a></li>
                                </ul>
                            </li>
                        </ul> <!-- end menu -->
                    </nav> <!-- end nav-wrap -->
                </div> <!-- end flex-parent -->
            </div> <!-- end container -->
        </div>
    </header> <!-- end navigation -->

and here my class-wp-bootstrap-navwalker

               <?php /* Primary navigation */
                        wp_nav_menu( array(
                          'menu' => 'Primary',
                          'depth' => 2,
                          'container' => '',
                          'menu_class' => 'nav__menu',
                         //Process nav menu using our custom nav walker
                          'walker' => new wp_bootstrap_navwalker())
                        );
                    ?>

the problem is… the menu get li itemscope=”itemscope” and broken my theme css ul class dropdown

0
, Rohdrich silva 4 years 2019-11-29T09:16:21-05:00 0 Answers 132 views 0

Leave an answer

Browse
Browse