How can I maintain clickable links while using a mega menu in Dawn theme?

[castlefurniture]

Is there a way to retain the functionality of the menu link being an active clickable link while also being used as a mega menu? I'm using code to make the mega menu appear on hover.

This website shows how I'd like the navigation to function, they have the mega menu on hover and the category link remains clickable
https://www.blossomus.com/

Here is the link to my shopify store

https://2bb416.myshopify.com/

[DaviesYoung · Accepted solution]

If I understand correctly you could try to add a link to the menu-items with a subnav.
- Snippets > header-mega-menu.liquid (l.19-25)

{%- assign parentlink = link.links[0] -%}
<a href="{{ parentlink.url }}" title="{{ parentlink.title }}">
  <span
    {%- if link.child_active %}
      class="header__active-menu-item"
    {% endif %}
  >
    {{- link.title | escape -}}
  </span>
</a>

My two cents. Good luck!

[castlefurniture]

Thank you this works!

[StanleyTse]

Hi Davies,

  The codes are working but one more question from me.

  The {%- assign parentlink = link.links[0] -%} code make the clickable parent menu link to the first url of the first child column.

  However, I would like to know how to make the parent link linking to the parent URL , i.e. click on the "iPhone" to the "All iPhone" (green arrow), not to the "iPhone 15 (red arrow)?  Thanks!