I do have a script that makes the header on dawn theme active on hover. As header menu of dawn theme is controlled via JS, we must add few JS codes to the theme.
Also, I would like to preview your store so that i can give further recomendations based on yout storefront. The below codes contains CSS which may require updated based on the height of the header. I had created this code which works perfectly for normal dawn theme. However, if you have already made custom changes on the header, we may need to make a few updates.
To implement the feature, please add bellow code to the end of theme.liquid file.
My recomended solution for mobile device would be to keeb the default functionality of the dawn theme. Dawn theme already provides a drawer which is user friendly.
If you require further detailed feedback, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!
Hey @AllisonMH ! Sounds like you already found a solution, but just in case anyone else is looking for way to accomplish this:
One option for this (without using any code) would be to look into using a mega menu app, such as our Meteor Mega Menu app. The Meteor app allows you to build beautiful mega menus using either a hover or click trigger to activate the menus. We also automatically default to click on mobile to allow it to work correctly, since as you pointed out, hovering isn’t really a thing with touchscreens.
You can check out our demo site here to view all of our template options.
Allison if you found a solution for the Parent Link working as an actual link to another page rather than activating the dropdown could you please post it here?
I’ve been looking for solutions for days. Thank you
Thank you it worked for me, only searching for another solution for the Parent Link working as an actual link to another page rather than activating the dropdown!