Add Clickable Submenu for phone on Dawn theme

Technical Q&A
,

Topic summary

A user seeks to make submenu items clickable on mobile devices in the Dawn theme, as this functionality already works on desktop. The issue is that clicking submenu names doesn’t navigate to their linked URLs—only the arrow icon opens nested submenus.

Solution provided:

  • Modify header.liquid file in the theme code
  • Find Details-menu-drawer-menu-item and add markup code to make first-level submenu items clickable
  • For nested submenus (second level), locate Details-menu-drawer-submenu and apply similar code changes
  • Screenshots with code snippets were shared showing the exact placement and syntax

Implementation notes:

  • The solution was partially successful initially—first-level items became clickable, but second-level items still only opened further submenus
  • A follow-up fix addressed the nested submenu issue
  • One user adapted the solution for Dawn Theme v8.0 (around line 159), noting the original code had missing link titles and URLs, though the arrow still navigates to submenus as intended
Summarized with AI on November 22. AI used: claude-sonnet-4-5-20250929.
1

Hello,

I want my submenu to be clickable on phone. This already works perfectly in the desktop version. But not yet on the phone.

I would like that when I click on the submenu name I get to the stored link and only when I click on the arrow on the edge, i go in the next submenu.

Menu Phone.png
Menu Phone.png1170×2052 169 KB

Maxi-Brillian (maxibrillian.com)

pw deropa

2

Hi @MaxiMaxi ,

Please go to Actions > Edit code > Sections > header.liquid file, find ‘Details-menu-drawer-menu-item’ and add code here:

Screenshot.png
Screenshot.png1177×858 55.8 KB

Code:


                              {{ link.title | escape }}

Hope it helps!

1 Like
3

Thank you for your help…

ok the first part is working…

means the menu is Name1 → Name2 → Name(End)

now i can click on the “Name1” and i go (like i want) directly to the linked collection(perfect), but when i use the arrow and i come to menu point “Name2” it doesnt work and i go only in the next submenu.

hope you understand

thank you allready

4

Hi @MaxiMaxi ,

Please find ‘Details-menu-drawer-submenu’ and change code here:

Screenshot.png
Screenshot.png1389×850 59.3 KB

Code:


                                            {{ childlink.title | escape }}

Hope it helps!

1 Like
5

Awesome, I had to adapt it slightly for Dawn Theme v8.0.

Around Line 159, I have the following:

{% comment %}{{ link.title | escape }}{% endcomment %}

{{ link.title | escape }}

With your original code I had no link title and there was no link. The right arrow still clicked through to the submenu!

2 Likes