Top Menu Bar Doesn't Allow Me To Click The First Menu Item

Luc1234
New Member
8 0 0

I've created Menu Items with main categories and then categories beneath those. (dawn theme)

 

Main category: iPhones

Drop down from iPhones: more Iphones

 

I can click on the drop-down menu, but I can't click the first main category (from example, Iphones) to show all the products from the drop-down options. 

 

Does anyone know how to fix this? Thanks!
Site: Designyourcase.nl
Password: Voetbal

Replies 5 (5)

makiomilano
Excursionist
27 0 4

I have the same problem and nobody answer.

Vinsinfo
Shopify Partner
252 91 83

@Luc1234 We can achieve this through some customization in code. Please follow below steps to redirect to the respective main category page and let me know whether it is useful for you.

1. From admin, go to "Online Store" -> "Themes".
2. Click action button from the current theme and select "Edit code".
3. Search "header-dropdown-menu.liquid " and "header-mega-menu.liquid" and replace the below code with "<span {%- if link.child_active %} class="header__active-menu-item" {% endif %} > {{- link.title | escape -}} </span>" like below screenshot.

 

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

priyavinsinfo_0-1709797409195.png  priyavinsinfo_1-1709797415295.png

 

 

Please provide your support by click "Like" and "Accepted" if our solution works for you. Thanks for your support.

Luc1234
New Member
8 0 0

Hello thanks for your reaction But what to I need to delete first? I know I need to paste this somewhere but what code do I need to delete to replace it with this?

Luc1234
New Member
8 0 0

Hello, it worked but now the name is a other color then white. How can I resolve this?
Thanks!

Luc1234_0-1709816894558.png

 

Vinsinfo
Shopify Partner
252 91 83

@Luc1234 Please add below code in the "if" condition in the code which we provided in the previous comment and let me know whether it helps you. Please find the attached screenshot for your reference.

 

link.current or

 

priyavinsinfo_0-1709823143633.png

 

Then, find "base.css" file and paste below code at the bottom of the file.

 

header-menu .header__menu-item a {
    color: #FFFFFF !important;
    text-decoration: none !important;
}

 

 

Please provide your support by click "Like" and "Accepted" if our solution works for you. Thanks for your support.