Liquid, JavaScript, themes, sales channels
Hello!
I'm using the Ride by Shopify theme and I'm looking for guidance with my navigation menu. I'd like to align my main menu to appear on either side of the logo on the same line, so half of the menu would appear to the left and half of the menu would appear to the right. How would I go about doing this through my theme code?
Password: chickendumplings
Hello @okchaychay ,
It's GemPages support team and glad to support you today. I would like to give you the recommendation to support you.
In this case, basically, you need to edit the HTML structure of the theme and it will be a bit complicated.
However, I give you another option. If you will fix your menu like that, you can try using my below suggestion:
1. Go to Online Store > Theme > Edit code of your current theme
2. Open your theme.liquid theme file
3. Paste the below code before </head>
<style>
@media (min-width: 769px) {
.header nav.header__inline-menu {
position: absolute;
z-index: 1;
}
.header nav.header__inline-menu .list-menu li:nth-child(3) {
margin-right: 90px;
}
.header nav.header__inline-menu .list-menu li:nth-child(4) {
margin-left: 90px;
}
.header .header__heading {
z-index: 9;
}
}
</style>
For example,
*One more time: my code just be suitable in this case that your menu be kept as it is
If you require any further information, feel free to contact me.
Best regards,
GemPages Support Team
Hi @okchaychay
Please follow these steps:
1. Go to Online Store > Theme > Edit code
2. Open your theme.liquid theme file
3. Paste the below code before </head>
<style>
@media (min-width: 990px) {
.header nav.header__inline-menu {
position: absolute;
z-index: 1;
}
.header__inline-menu .list-menu li:nth-child(3) {
margin-right: 92px;
}
.header__inline-menu .list-menu li:nth-child(4) {
margin-left: 92px;
}
.header .header__heading {
z-index: 2;
}
}
</style>
I hope that it works for you.
User | RANK |
---|---|
13 | |
11 | |
7 | |
6 | |
6 |
Learn these 5 things I had to learn the hard way with starting and running my own business
By Kitana Jan 27, 2023Would you love to unleash the unbridled power of the Google Shopping Channel into your sho...
By Gabe Jan 6, 2023How can you turn a hobby into a career? That’s what Emmanuel did while working as a wa...
By Skye Dec 30, 2022