Re: Dawn Parent Menu Item Clickable - FINALLY SOLVED!

Dawn Parent Menu Item Clickable - FINALLY SOLVED!

cmag
Tourist
7 0 4

I'm posting this to help the countless others who (also) undoubtedly spent hours and failed attempts trying to make the parent menu items in Dawn Theme (currently 14.0) clickable when child menu items are active.

 

It's important to note this solution makes the parent menu clickable WITHOUT changing the coloring and styling. (see more below*)

 

For the record --- it should NOT be this complicated to make a CORE FUNCTION work. I'm hoping the Shopify Team sees this and applies the fix to the Dawn and other Shopify themes. Because if not, then every time there is a new theme update, us users will have to manually go back in and re-add this code. 😒

 

The fix is in two parts --- desktop and mobile:

 

@Kani is the lifesaver behind the desktop part. See their original solution here to copy the code.

 

Many people think this solution doesn't work because the instructions are for an outdated file name.

 

The key is to replace the code in both of the following files for Dawn 14.0: 

1. header-mega-menu.liquid

2. header-dropdown-menu.liquid

 

The next part is fixing it for mobile:

 

For that, @LitCommerce gave the solution in this post here.

 

The key for using their code is to apply in the header-drawer.liquid file for Dawn 14.0. 

 

And that's it! I hope this helps some people. I know it would have saved me HOURS trying outdated and problematic solutions. Their code is great, you just have to put it in the right files for 2024!

 

❤️Cmag

----

 

*Before I found the above answers, I had tried so many other solutions posted throughout this forum. One made the menu item linkable (yay!) but changed the link colors to blue and purple (boooo!). Then I found another solution that fixed the coloring issue (yay!), but ended up affecting ALL the links on my site, not just the menu ones, essentially overriding every custom button and color scheme (boooo!). So trust me when I saw I worked hard to bring the above code-masters to you. 😅

Replies 3 (3)

davidhc
Tourist
4 0 2

Wow. I cannot believe I have been fighting with this for the past couple days, and you've posted the solutions here literally yesterday! Thanks so much Cmag.

 

I can echo everything Cmag has said here. It should NOT be this hard to make this sort of edit. It seems so strange this is not a default feature of the theme, not having it actively makes the themes look out of date. I really hope Shopify see this and make the change needed, unless are they doing this so we all just use premium themes instead?

 

Cmag, bizarrely mine worked just by doing the first code edit in the first location only. I have also added code to make the mega menu appear when the user hovers over the menus too though, did you do that? I noticed someone in the links you referenced mentioned they 'turned the hover' functionality on, I'm guessing they mean they added the same code I did. As I cannot see anywhere to 'turn' that on either 😅 Again, another element that is crazily not standard core feature set for a menu.

cmag
Tourist
7 0 4

Hey @davidhc - Glad it was helpful!

 

The header-dropdown-menu.liquid file may only be needed if there is a grandchild menu item, but I could be wrong! (the hours and threads and attempts blurred together so I don't remember!) I'm keeping it in both places just to be safe since I know it works. haha

 

I do know that the mega-menu alone did not make the parent items work for me on mobile, so I definitely had to add the code for header-drawer.liquid.

davidhc
Tourist
4 0 2

Hi @cmag, oh yes very true, I didn't put the mobile menu code in as I didn't think it was worth it. Just tried it now and will be keeping it as that works nicely too 😄 Thanks again haha

 

Not looking forward to redoing this next time the theme updates, but maybe, just maybe Shopify will implement this natively!