Responsive Ad Area

Share This Post

test

WP Bootstrap Navwalker Mobile Menu Not Working

I am using the WP bootstrap navwalker for my wordpress site. The desktop version of the menu is working properly but there’s some problem with the hamburger menu. The hamburger menu is showing up but the collapse thing is not working.
Here’s my Navwalker Menu:

    <nav class="navbar navbar-expand-lg navbar-light bg-color">
  <button class="navbar-toggler ml-auto" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span>   
    <i class="fas fa-bars"></i>
    </span>
  </button>

  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav mx-auto">
    <?php
      wp_nav_menu( array(
    'theme_location'  => 'primary',
    'depth'           => 2, // 1 = no dropdowns, 2 = with dropdowns.
    'container'       => 'div',
    'container_class' => 'collapse navbar-collapse',
    'container_id'    => 'bs-example-navbar-collapse-1',
    'menu_class'      => 'navbar-nav mr-auto',
    'fallback_cb'     => 'WP_Bootstrap_Navwalker::fallback',
    'walker'          => new WP_Bootstrap_Navwalker(),
) );
    ?>
    </ul>

  </div>

</nav>

and here’s my enqueued scripts:

//Register WP NAVWALKER
    require_once('wp-bootstrap-navwalker.php');

    //Theme Support
    function wpb_theme_setup(){
        //NAV Menus
        register_nav_menus(array(
            'primary' =>__('Primary Menu')
        ));

        //CSS Files
        wp_enqueue_style('font-awesome', '//use.fontawesome.com/releases/v5.5.0/css/all.css');

        wp_enqueue_style('bootstrap', '//stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css');

        wp_enqueue_style('owl-carasoul', '//cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.css');

        wp_enqueue_style( 'baguette-box', '//cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.10.0/baguetteBox.min.css');

        wp_enqueue_style('main-css', get_stylesheet_uri(), NULL, microtime(), false);


        //Scripts 

        wp_enqueue_script('jquery', '//cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js', NULL,'1.0', false);

        wp_enqueue_script('owl', '//cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js', NULL, '1.0', true);

        wp_enqueue_script('bootstrap-js', '//stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js', NULL, '4.1.3', true);

        wp_enqueue_script('baguette-js', '//cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.10.0/baguetteBox.min.js', NULL, '1.10.0', false);

    }

    add_action('after_setup_theme', 'wpb_theme_setup');


WP Bootstrap Navwalker Mobile Menu Not Working
WP Bootstrap Navwalker Mobile Menu Not Working
test
{$excerpt:n}

Share This Post

Leave a Reply

Your email address will not be Publishedd. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Skip to toolbar