Why isn't my header menu clickable?

I need help to make my header menus (kroppsvård, hem&inredning" etc) clickable.

Only the dropdown menus ("Hudvård, hårvård etc) are clickable but the header is only available using breadcrumbs to go backwards so to speak. I’m using Refresh theme. Please help! :heart:

www.oddlysocks.se

Hi @PernillaH

  1. From your Shopify admin, go to Sales channels > Online Store > Themes.
  2. Click the … button next to current theme, and then click Edit code.
  3. Open the file snippets/header-dropdown-menu.liquid and find the following snippets:
              <summary
                id="HeaderMenu-{{ link.handle }}"
                class="header__menu-item list-menu__item link focus-inset"
              >
                <span
                  {%- if link.child_active %}
                    class="header__active-menu-item"
                  {% endif %}
                >
                  {{- link.title | escape -}}
                </span>
                {% render 'icon-caret' %}
              </summary>

And update it like this and save file.

              <summary
                id="HeaderMenu-{{ link.handle }}"
                class="header__menu-item list-menu__item link focus-inset"
              >
                <a
                  href="{{ link.url }}"
                  style="text-decoration: unset;"
                >
                  <span
                    {%- if link.child_active %}
                      class="header__active-menu-item"
                    {% endif %}
                  >
                    {{- link.title | escape -}}
                  </span>
                </a>
                {% render 'icon-caret' %}
              </summary>

Thanks, it kind of works! But the colours changed and when hovering the word gets underscored, like an old URL link. How do I fix this design problem?
Skärmklipp.JPG

Please try to update code to this


@Dan-From-Ryviu Thank you!

You are very welcome!