bootstraps navbar dropdown menu not working

Davit_Azizyan
Tourist
7 1 0

Hi, i am learning shopify development by developing a store. I have added bootstrap navbar to my store. here is code for it. But jewelry dropdown menu not working it shows correct links when hovering over it but it not opens the pages.

Can you help me please. You can access my store in this address: https://codeinspire-dev2.myshopify.com/

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <div class="container">
    <a class="navbar-brand" href="#">
        <img src="{{section.settings.logo img_url:'master' }}" alt="" width="{{section.settings.logo_max_width}}px" >
    </a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav mr-auto">
            {% for link in linklists[section.settings.menu].links %}
              {% if link.links != blank %}
                <li class="nav-item dropdown">
                  <a href="{{ link.url }}" class="nav-link dropdown-toggle" href="#" role="button"  data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    {{ link.title }}                   
                  </a>
                  <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                    {% for childlink in link.links %}
                        <a href="{{ childlink.url }}" class="dropdown-item">
                          {{ childlink.title }}
                        </a>
                    {% endfor %}
                  </div>
                </li>
              {% else %}
                <li  class="nav-item">
                  <a href="{{ link.url }}" class="nav-link">
                    {{ link.title }}
                  </a> 
                </li>
              {% endif %}
            {% endfor %}
          </ul>
          <ul class="navbar-nav">
            <li class="nav-item dropdown mini-cart">
              <a class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                Cart
              </a>
              <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                  <div class="dropdown-item-text">
                      {% include 'mini-cart' %}
                  </div>
              </div>
            </li>
          </ul>
    </div>

  </div>
      
</nav>
Reply 1 (1)

Davit_Azizyan
Tourist
7 1 0

Sorry for disturbing, now it's solved i have jquery for resolving the issue