Shopify themes, liquid, logos, and UX
Hi all.
I am using the dawn theme. I wanted to add a hamburger menu in the header instead of the usual menu. However, while I was able to add a hamburger menu, the original menu is still showing.
This is how my menu looks now:
See, the hamburger icon is below the logo. I want the logo to be centered and the menu icon to be on the left hand side. I also want the top navigation removed since its now in the hamburger menu. But I got no idea what to do.
Here is the code I used to add the hamburger menu:
@media screen and (min-width: 990px){
.header--top-center>.header__search, .header:not(.header--top-center) *>.header__search {display: none !important;}
.header:not(.header--middle-left) .header__inline-menu { display: none !important;}
.header--top-center *>.header__search, .header:not(.header--top-center)>.header__search { display: inline-flex !important;}
header-drawer {display: block !important;}
}
Any help would be greatly appreciated. Here is my website link www.PennsylvaniaParks.org
Thank you in advance!
Hello @Justin34
This design from the theme
You can follow these steps:
1. Go to Online Store->Theme->Edit code
2. Open your theme.liquid file, paste the below code before </body>
<style>
header-drawer {
display: block !important;
}
.header__inline-menu {
display: none !important;
}
</style>
I hope the above is useful to you.
Kind & Best regards,
GemPages Support Team
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024