Solved

How can I replace a click listener with an href in a Dawn template menu?

Fabi23
Visitor
2 0 1

I've created a Mega Menu using the Dawn template and subsequently added code in header.liquid to avoid having to click on my header to expand this menu. Then, I wanted to make it possible to click on "Products" to be led to the collections via an <a href>. However, the click listener for the menu still exists, causing it to close and open.

 

The question is: Where can I find this click listener and subsequently replace it with an href?

 

As an example, the "Products" tab should function similarly to what is found at https://www.esn.com/en.

Accepted Solution (1)

Dan-From-Ryviu
Shopify Partner
7717 1500 1504

This is an accepted solution.

Hi @Fabi23 

Dan here from Ryviu: Product Review & QA app. 

You can do that by following this instruction

Go to your Online store > Themes > Edit code > open header-dropdown-menu.liquid and header-mega-menu.liquid files, find those lines of code (from line 19th-25th)

 

                <span
                  {%- if link.child_active %}
                    class="header__active-menu-item"
                  {% endif %}
                >
                  {{- link.title | escape -}}
                </span>
                {% render
Change to this and save the file
                <a class="header__menu-item list-menu__item link link--text focus-inset" href="{{ link.url }}">
                <span
                  {%- if link.child_active %}
                    class="header__active-menu-item"
                  {% endif %}
                >
                  {{- link.title | escape -}}
                </span>
              </a>

 

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

View solution in original post

Replies 3 (3)

Dan-From-Ryviu
Shopify Partner
7717 1500 1504

This is an accepted solution.

Hi @Fabi23 

Dan here from Ryviu: Product Review & QA app. 

You can do that by following this instruction

Go to your Online store > Themes > Edit code > open header-dropdown-menu.liquid and header-mega-menu.liquid files, find those lines of code (from line 19th-25th)

 

                <span
                  {%- if link.child_active %}
                    class="header__active-menu-item"
                  {% endif %}
                >
                  {{- link.title | escape -}}
                </span>
                {% render
Change to this and save the file
                <a class="header__menu-item list-menu__item link link--text focus-inset" href="{{ link.url }}">
                <span
                  {%- if link.child_active %}
                    class="header__active-menu-item"
                  {% endif %}
                >
                  {{- link.title | escape -}}
                </span>
              </a>

 

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

Fabi23
Visitor
2 0 1

This works perfectly.

Thank you very much!

Dan-From-Ryviu
Shopify Partner
7717 1500 1504

You are very welcome

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now