wp_bootstrap_navwalker mobile menu issue

Question

I am making a wordpress website from html and i'm using wp_bootstrap_navwalker.php to create a dropdown menu. I have successfully created that menu and it's coming nicely on laptop and desktop but when but in mobile or tablet this menu isn't coming , though it was coming in .html files

Here is my HTML code :

<div class="collapse navbar-collapse" id="bs-megadropdown-tabs">
    <ul class="nav navbar-nav nav_1">
        <li><a href="index.html">Home</a></li>
        <li><a href="about.html">About</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Matches<span class="caret"></span></a>
          <ul class="dropdown-menu" role="menu">
            <li><a href="matches.html">New Matches</a></li>
            <li><a href="viewed-profile.html">Who Viewed my Profile</a></li>
            <li><a href="viewed-not_contacted.html">Viewed & not Contacted</a></li>
            <li><a href="members.html">Premium Members</a></li>
            <li><a href="shortlisted.html">Shortlisted Profile</a></li>
          </ul>
        </li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Search<span class="caret"></span></a>
          <ul class="dropdown-menu" role="menu">
            <li><a href="search.html">Regular Search</a></li>
            <li><a href="profile.html">Recently Viewed Profiles</a></li>
            <li><a href="search-id.html">Search By Profile ID</a></li>
            <li><a href="faq.html">Faq</a></li>
            <li><a href="shortcodes.html">Shortcodes</a></li>
          </ul>
        </li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Messages<span class="caret"></span></a>
          <ul class="dropdown-menu" role="menu">
            <li><a href="inbox.html">Inbox</a></li>
            <li><a href="inbox.html">New</a></li>
            <li><a href="inbox.html">Accepted</a></li>
            <li><a href="sent.html">Sent</a></li>
            <li><a href="upgrade.html">Upgrade</a></li>
          </ul>
        </li>
        <li class="last"><a href="contact.html">Contacts</a></li>
    </ul>
 </div>

And here is the code which i was replacing with the above html one

<div class="collapse navbar-collapse" id="bs-megadropdown-tabs">
    <?php
        wp_nav_menu( array(
            'menu'              => 'primary',
            'theme_location'    => 'primary',
            'depth'             => 2,
            'container'         => 'div',
            'container_class'   => 'collapse navbar-collapse',
            'container_id'      => 'bs-example-navbar-collapse-1',
            'menu_class'        => 'nav navbar-nav nav_1',
            'fallback_cb'       => 'WP_Bootstrap_Navwalker::fallback',
            'walker'            => new WP_Bootstrap_Navwalker())
        );
    ?>
</div>

I don't know why isn't coming ?

Answer 1

You need to replace your bootsrap function with this one.

<?php
        wp_nav_menu( array(
            'menu'              => 'primary',
            'theme_location'    => 'primary',
            'depth' => 0,
      'container' => 'false',
            'menu_class'        => 'nav navbar-nav nav_1',
            'fallback_cb'       => 'WP_Bootstrap_Navwalker::fallback',
            'walker'            => new WP_Bootstrap_Navwalker())
        );
    ?>

In your code a container was added and that is why your desired menu wasn't coming properly. I hope this will work for you. :)