My menu links just closes the menu without taking you to the link

ZTSearchLabs
New Member
1 0 0

Yeah that pretty much sums it up. When I've got a 3 nested menus and if it's on the second level and doesn't have a child it wont link. but if it has a child it will. it seems to have something to do with the arai-expanded property as when I inspect the page and change the value it will sometimes link. but I'm not sure of the root problem here.

here is my .liquid file

<ul class="site-nav list--inline {{ nav_alignment }}" id="SiteNav">
    {% for link in linklists[section.settings.main_linklist].links %}
      {%- assign child_list_handle = link.title | handleize -%}
  
      {% comment %}
        Check if third-level nav exists on each parent link.
      {% endcomment %}
      {%- assign three_level_nav = false -%}
      {% if link.links != blank %}
        {% if link.levels == 2 %}
          {%- assign three_level_nav = true -%}
        {% endif %}
      {% endif %}
  
      {% if link.links != blank %}
        <li class="site-nav--has-dropdown{% if three_level_nav %} site-nav--has-centered-dropdown{% endif %}{% if link.active %} site-nav--active{% endif %}" aria-haspopup="true" aria-controls="SiteNavLabel-{{ child_list_handle }}">
          <a href="{{ link.url }}" class="site-nav__link site-nav__link--main"{% if link.active %} aria-current="page"{% endif %} aria-expanded="false">
            {{ link.title }}
            {% include 'icon-chevron-down' %}
          </a>
  
          <div class="site-nav__dropdown{% if three_level_nav %} site-nav__dropdown--centered{% endif %}" id="SiteNavLabel-{{ child_list_handle }}">
            {% if three_level_nav %}
              <div class="site-nav__childlist">
                <ul class="site-nav__childlist-grid">
                  {% if link.links != blank %}
                    {% for childlink in link.links %}
                      <li class="site-nav__childlist-item{% if childlink.links != blank %} site-nav__dropdown--level-three{% endif %}">
                      {% comment %}<li class="site-nav--has-dropdown{% if three_level_nav %} site-nav--has-centered-dropdown{% endif %}{% if link.active %} site-nav--active{% endif %}" aria-haspopup="true" aria-controls="SiteNavLabel-{{ child_list_handle }}">{% endcomment %}
                        <a href="{{ childlink.url }}" class="site-nav__link site-nav__link--main" aria-expanded="false">
                          {{ childlink.title | escape }}
                          {% comment %}
                          {% if childlink.links != blank %}
                            {% include 'icon-chevron-down' %}
                          {% endif %}
                          {% endcomment %}
                        </a>
                        
                        {% if childlink.links != blank %}
                          <div class="site-nav__dropdown{% if three_level_nav %} site-nav__dropdown--centered{% endif %}" id="SiteNavLabel-{{ child_list_handle }}">
                            <ul>
                            {% for grandchildlink in childlink.links %}
                              <li>
                                <a href="{{ grandchildlink.url }}" class="site-nav__link site-nav__child-link"{% if grandchildlink.active %} aria-current="page"{% endif %}>
                                  {{ grandchildlink.title | escape }}
                                </a>
                              </li>
                            {% endfor %}
                            </ul>
                          </div>
                        {% endif %}
                      </li>
                    {% endfor %}
                  {% endif %}
                </ul>
              </div>
  
            {% else %}
              <ul>
                {% for childlink in link.links %}
                  <li {% if childlink.active %}class="site-nav--active"{% endif %}>
                    <a href="{{ childlink.url }}" class="site-nav__link site-nav__child-link{% if forloop.last %} site-nav__link--last{% endif %}"{% if childlink.active %} aria-current="page"{% endif %}>
                      {{ childlink.title | escape }}
                    </a>
                  </li>
                {% endfor %}
              </ul>
            {% endif %}
          </div>
        </li>
      {% else %}
        <li {% if link.active %} class="site-nav--active"{% endif %}>
          <a href="{{ link.url }}" class="site-nav__link site-nav__link--main"{% if link.active %} aria-current="page"{% endif %}>{{ link.title }}</a>
        </li>
      {% endif %}
    {% endfor %}
  </ul>
0 Likes