Shopify themes, liquid, logos, and UX
Hello everyone,
I would like to make my sub-menu expand to the right instead of downwards, as it does now. I’ve tried some other "solved" solutions, but they didn't work for me. I am kindly asking for assistance on how to achieve this and whether it’s possible to include a script that will add a smooth transition and expansion.
Please note that I want this solution to apply only to laptops and PCs, as the menu I use for phones is a drawer.
Theme in use: DAWN
Website: https://official-kortez.com/
Thank you all in advance!
Hi @Official-Kortez,
Please change the dropdown to mega menu
Hello @Official-Kortez
Thanks for the info, try this one.
1. From your Shopify admin dashboard, go to "Online Store" and then "Themes".
2. Find the theme you want to edit and click on "Actions", then select "Edit code".
3. In the "Assets" folder, locate and click on the CSS file (often named something like styles.css or theme.scss.liquid).
4. Add your custom code at the bottom of the file or wherever it’s appropriate based on your needs.
.header-wrapper header.header {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
padding-bottom: 0 !important;
}
.header-wrapper header.header nav.header__inline-menu {
margin: 0;
}
Hello @Official-Kortez
Thanks for the info, try this one.
1. From your Shopify admin dashboard, go to "Online Store" and then "Themes".
2. Find the theme you want to edit and click on "Actions", then select "Edit code".
3. In the "Assets" folder, locate and click on the CSS file (often named something like styles.css or theme.scss.liquid).
4. Add your custom code at the bottom of the file or wherever it’s appropriate based on your needs.
.header-wrapper header.header {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
padding-bottom: 0 !important;
}
.header-wrapper header.header nav.header__inline-menu {
margin: 0;
}
I think I might have explained it wrong but what I actually want to do is a menu that expands on the right side (see image below):
@Official-Kortez
Did you change the dropdown to the mega menu?
Yes for now since I didnt like the drop-down. Should I set it back for you?
Learn what's possible with customizing Shopify Checkout beyond what's available out of...
By Shopify Feb 19, 20252m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025