Hi,
I have a drop down menu, but with too many collection, i would love to have a drop down menu that opens on the side for the 3rd level (now is opening below).
Can please someone help me doing that?
Thanks
pw: subnormal
Hi,
Yes, this is what i’m looking for, someone that can paste part of the CSS/Liquid.
I’m new to web development
Thanks
Hello @danbot ,
As I understand you are looking to change the drop-down for the third level to open horizontally to the side (similar to this https://prnt.sc/b7LuYw_9Ocx1 ) instead of vertically below the parent option.
This can be implemented with the help of below mentioned Shopify app, please take a look -:
- https://apps.shopify.com/globo-mega-menu
- https://apps.shopify.com/smart-menu
- https://apps.shopify.com/meteor-mega-menus
I hope the app helps you.
Kindly let me know if you have any query.
Thank you.
HI,
I would rather not using an external app, I don’t want to loose the design I created, I prefer to get a snippet that I can use in the css/liquid
Hello @danbot ,
Ok, I understand.
Please add the below mentioned code in your store .css file (base.css/style.css/theme.css)
.header__submenu .header__submenu {
position: absolute;
left: 100%;
background: red;
min-width: 300px;
top: 0;
border: 1px solid #000;
}
header-menu .header__submenu>li {
position: relative;
}
.header__submenu .icon-caret {
transform: rotate(-90deg);
}
details[open]>.header__menu-item .icon-caret {
transform: rotate(90deg);
}
After implementing the code output will look like this https://prnt.sc/11ebO0anFun-
I hope the solution helps you.
Please let me know if you have any question.
Thank you.
Hi Anshul,
It worked!
THere’s only a little detail that has to change: when you open one sub collection and then you open another one, the first one stays open. Is it possible to change this? Thanks a lot
Hello @danbot ,
Yes, it is possible to resolve this issue. However, you cannot resolve this at your end.
This will be a time taking task as the developer needs to deep down check your store code.
I will suggest you hire a shopify developer for this task, so that the sub collection menu problem can be fixed.
Thank you.