Mega Menu with Images and auto open when hovered over

Store Design
,
1

Hi

I’m currently using the Dawn theme, but I want to use the mega menu with images and have it automatically open when hovered over rather than clicked.

I want to achieve something like this

Addison99_0-1720782782820.png
Addison99_0-1720782782820.png1252×301 106 KB

trying to avoid using an app that will have a monthly fee

2

Hi,

Hope this will help

At header.liquid or similar sections or templates, need to add mega menu structure by replacing or modifying existing menu also need to add CSS for styling and javascript for additional functionality

Example of mega menu structure
3

Hello @Addison99 , To create Mega Menu with images follow the below steps.

  1. Add featured image to all your collections.

  2. Open “header.liquid” in your code editor. Find “HeaderMenu-MenuList-” id in the file.

  3. Replace below code in your “header.liquid”


   
  

{{ childlink.title | escape }}

Review the Screenshot for your reference:

Screenshot_6.png
Screenshot_6.png1603×809 64.3 KB

AT

4

Cant see where that code would go?

5

Hi thanks for the information but HeaderMenu-MenuList- is not in my header.liquid

6

Hi @Addison99 , Can you please share your Storefront URL?

7

https://8dfa7a-8d.myshopify.com

Store is not live yet