search

puikinsh / Dazzling

Flat design WordPress WooCommerce theme developed using Bootstrap 3 and FlexSlider
http://colorlib.com/wp/themes/dazzling/
198 stars 137 forks source link

Burger Menu unresponsive #64

Open JoAdGreen opened 6 years ago

JoAdGreen commented 6 years ago

Hi there,

I have a child theme for Dazzling running my website (www.adgreen-apa.net) but the burger menu (i.e. the three horizontal line button) you see either when the web browser is too narrow to display the full menu, or on devices as default, is not working. It's still shown but nothing happens when you click on it. I have already made sure I have the latest version of the parent theme.

Having got in touch with colorlib, they noticed there are elements missing which are required for the menu to work, such as .navbar-collapse, .navbar-default. I built the child theme myself so am relatively happy to dabble with adding bits of code here and there but obviously don't want to go messing things up which could have a knock on effect on something else.

If someone could let me know exactly what code to add (and where) that would be great.

Thanks, Jo

FireEmerald commented 6 years ago

Replace: <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar"> with: <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">

data-target must reference a class from your navbar div:

<div class="collapse navbar-collapse navbar-ex1-collapse">
    <ul id="menu-top-menu-bar-v2" class="nav navbar-nav">

2017-09-15 10_33_01-

JoAdGreen commented 6 years ago

Thanks very much, i'll give this a try...

ElStupid commented 2 years ago

This might solve your error, unless you get a Bootstrap js error: Bootstrap's JavaScript requires jQuery version 1.9.1 or higher, but lower than version 3

In that case reference this url and update your bootstrap.min.js to version 3.4.1. That somehow works only in my parent theme (in case you have a child theme)