Compatibility: Shopify 2.0 FREE themes , Dawn to Colorblock theme. Does not work with Dawn version 9.0 and above
Everyone wants to have nice hover effect on their menus. With the current settings with Shopify 3.0 themes, it is hard to obtain this without changing the HTML code. Since we are only doing the hover effect and of course in mobile, there is no such thing as hover, therefore I did not change the mobile settings.
There is already an option for mega menu in Dawn version 9.0 and above. Please check your theme editor.
What you are buying:
- Hover to open header menus
- Easy to follow steps
- No javascript being use
What makes our code better:
- We do not use external libraries, with that being said, our code will have no to minimal effect to your website's speed performance
- We do not leave or add codes use to advertise for our website
- Our code is mobile friendly
Any issues related to the code will be fix with no additional cost, excluding code customization requests. Simply contact us with "Chat with us." We are just a button away.
To start:
1. Go to your Admin store > Themes > Actions > Edit code.
2. Under the Sections folder, open the header.liquid file and find this "header__inline-menu". From the {%- if section.settings.menu != blank -%} to the closing {% endif %}, delete the code and replace it with the code below.
NOTE: For Dawn 4.0 and higher theme version, please follow the same instructions but when you open the theme editor, the option for mega menu and dropdown menu will not work.
With the new Dawn 5.0 update they provided a dropdown menu, make sure you delete the two {% endif %}.
If you are unsure, please do not hesitate to contact me at "Chat with us."
3. Last thing, click SAVE.
Please see the image on what it looks like if you have more levels in your navigation. Be mindful on how many second levels you place since its going to stretch.
That's it. No sweat right? If you have problem with the code, just contact me with "chat with us"
4 comments
Hi @CHRIS MADDOX,
Sorry about the bad experience you have with other developers. The compatibility in this code says doesn’t work in Dawn 9 and above. If you need to work it in Taste v11, you can talk to our experience developers and we will make sure the code works before you pay. So you don’t get left with non-working code.
Hi, will this code change work in Taste v11.0? I’ve tried several other code change solutions from other developers and none have worked, so while I am willing to pay for a fix that works, I’m not interested in paying for any more code that doesn’t work. Thanks for your time.
@CHRIS JOHNSON
There was changes done on the Dawn 4.0 Theme that would affect the header. One thing they added is a choice of mega menu and dropdown menu. The changes have not added a hover effect. Therefore, you still hove to click on those menus to see the childlink. The code still works in Dawn 4.0. I added some instructions to do so
Will these code changes work with Dawn 4.0?