Make parent menu clickable on mobile - Sense Theme

[kbee]

Hi,

I'm using Sense Theme and need help in making parent menus with dropdown clickable on mobile.

https://kbeautysource.com

The parent menus on desktop are clickable but not on mobile. Your help is much appreciated! Thank you.

[LitCommerce · Accepted solution]

Hi @kbee,

Please go to header.liquid file, find 'Details-menu-drawer-menu-item-' and change code here:

Code:

<a href="{{ link.url }}" class="menu-drawer__menu-item link--text">{{ link.title | escape }}</a>

Hope it helps!

[LitCommerce · Accepted solution]

Hi @kbee,

Please go to header.liquid file, find 'Details-menu-drawer-menu-item-' and change code here:

Code:

<a href="{{ link.url }}" class="menu-drawer__menu-item link--text">{{ link.title | escape }}</a>

Hope it helps!

[kbee]

Hi. Thank you, it worked! I just wanna figure out how to align the menus properly so they don't look like this on mobile. 

[LitCommerce · Accepted solution]

Hi @kbee,

Please change code:

<a href="{{ link.url }}" class="menu-drawer__menu-item link--text">{{ link.title | escape }}</a>

=>

<a href="{{ link.url }}" style="color: rgb(var(--color-foreground));text-decoration: none;">{{ link.title | escape }}</a>

Hope it helps!

[kbee]

Hi @LitCommerce ,

It worked. Thanks a lot for your help.

[LitCommerce]

Hi @kbee,

If it helped you solve your issue, please mark it as a solution. Thank you and good luck.

[BMos]

Hi @LitCommerce 

Do you know how to do this for the prestige theme?

Thanks

[Georgeeeee]

Have you found solution about Prestige?

Please reply.

[Mujammil]

I can't find this code now

[Simeon9311]

Hi there,

I have the same issue now but I cannot find 'Details-menu-drawer-menu-item-'. Its 2024 now so I guess there have been some updates to the file and now is a bit different.

Could you please help again with the issue?

Thanks!

[beachjody]

Did you find a solution to this? I also don't seem to have that in my code.

[cmag]

Thank you @LitCommerce! This worked for me! The key was to put it in the header-drawer.liquid file for Dawn 14.0.

[amiraelhadi]

if you want your subcategories clickable you can follow these steps:

Edit code —-> go to snippets—-> header-drawer.liquid

search for:
id="HeaderDrawer-{{ link.handle }}-{{ childlink.handle }}"

under this section you'll find this line:
{{ childlink.title | escape }}

replace it with this line:

<a href="{{ childlink.url }}" style="color: rgb(var(--color-foreground));text-decoration: none;">{{ childlink.title | escape }}</a>

[beachjody]

This worked for me! Thanks so much!

[d3dm1lk4n]

In Dawn 15.1.0 open header-drawer.liquid and replace these lines with the code below.

Line 32: {{ link.title | escape }}
<a href="{{ link.url }}" style="color: rgb(var(--color-foreground));text-decoration: none;">{{ link.title | escape }}</a>

Line 44: {{ link.title | escape }}
<a href="{{ link.url }}" style="color: rgb(var(--color-foreground));text-decoration: none;">{{ link.title | escape }}</a>

Line 66: {{ link.title | escape }}
<a href="{{ childlink.url }}" style="color: rgb(var(--color-foreground));text-decoration: none;">{{ childlink.title | escape }}</a>