Hello Everyone!
I am using Shopify Minimog 5.1.0 Theme. I want to fix the megamenu. I want to have 5 columns per line and rest of the columns will show below. Now it’s showing 9 columns on one line. It doesn’t look good. I want to fix this. Please help me. Thanks in advance.
Store: https://svelteclothes.myshopify.com/
Password: Admin
Hey @dreamtechzone_5
Please add this code on your css file
@media screen and (min-width: 1280px){
.m-menu__item--mega .m-sub-menu__item--level-1 {
width: 33.33%;
flex: 0 0 20%;
}
}
.m-mega-menu__container .m-sub-menu--level-1 {
display: flex;
flex-wrap: wrap;
}
I can’t find the css file. In which file should I add it?
Great, it worked. Also, when I hover over the megamenu ( AWARDS ) the search box in the header section is not showing. I want to show the search box. But when I click on the dropdown menu ( MEDALS ) the search box is showing. I want to fix this. Please help me. Thanks in advance.
That’s a theme bug.
Their demo store at https://demo.minimog.co/ also has this problem.
You can add this code to the “Custom CSS” to fix:
m-search-popup {
position: relative;
}
if my post is helpful, please like it ♡ and mark as a solution -- this will help others find it
Wow great. It worked. One more thing, When I click on the menu, the megamenu box and dropdown box will show below the “Orange” color bar. When I click on “AWARDS”, the “GLASS & CRYSTALS” menu below is not showing. When I click on the menu, the megamenu box and dropdown box will definitely show below the “Orange” color bar. Please help me. Thanks.
Not very clear. Do you mean that mega-menu hides second line of the menu if menu is wrapped into 2 lines?
Sub-menu opens not below orange line, but below parent menu item. It’s just that mega-menu covers more then drop-downs.
If sub-menu opens below orange line, it will auto-close when you move from “Awards” to the sub-menu over “Sport” and “Sport” sub-menu will open instead. So you would not be able to reach to “Awards” sub-menu (on this screen width).