[solved] Full-width drop down Menu (Craft theme)

[Asoufia]

Hi, 

is there a way to create a full width dop down menu? With each category in a seperate row and the products of the category displayed below the category title? 

I think what I am looking for is called a mega menu. I'd love to have a really simple and minimal menu that just displays a few categories + their content as links.

I am using the craft theme. 

Thank you so much! 🙂 
Anastasia

edit: I just saw that there is a possibility to change it in the theme settings! To change the menu from "dropdown" to "mega menu" and customize it with CSS from there on. 

[websensepro]

hi @Asoufia 

1. Go to Online Store 

2. Search for base.css file 

3. Paste this code 
details[open]>.header__submenu{

width: 100rem;

}

[Asoufia]

Thank you for your help! It worked. Unfortunately it doesn't show the menu under the menu and with a full 100% width: https://shop.asoufia.com/ 

Is there also a way to 

• make the submenu open on hover (rather than by clicking on it)?
• display the submenu (product categories) in a grid next to each other?
• display the content of each submenu?

I think what I am looking for is called a mega menu. I found an app for shopify to create it with but I would love to do it with CSS and very minimal if it's possible. 

Thank you so much for your help 🙂

 

[GemPages]

Hello @Asoufia 

To provide you with the most precise solution in this case, could you please share your page URL ( with pass if your store password is enabled )?

Thank you and hope to hear from you.
Best regards,
GemPages Support Team

[Asoufia]

Hi 🙂 That would be great, thank you! This is the link to my shop: https://shop.asoufia.com/