Re: Logo left and menu right side position on mobile view
Solved
Accepted Solution (1)
You add code following this instruction.
- Go to Online Store, click Themes
- In the current theme, click "..." > select Edit code
- Open theme.liquid file, add this code after <head>
<style>
@media (max-width: 749px) {
.header__main-nav {
grid-area: secondary-nav !important;
}
.header__main-nav .header__icon-list {
justify-content: flex-start !importnt;
flex-direction: row-reverse !important;
}
.header__logo {
grid-area: main-nav !important;
}
.header__secondary-nav {
grid-area: logo !important;
}
}
</style>The result
You add code following this instruction.
- Go to Online Store, click Themes
- In the current theme, click "..." > select Edit code
- Open theme.liquid file, add this code after <head>
<style>
@media (max-width: 749px) {
.header__main-nav {
grid-area: secondary-nav !important;
}
.header__main-nav .header__icon-list {
justify-content: flex-start !importnt;
flex-direction: row-reverse !important;
}
.header__logo {
grid-area: main-nav !important;
}
.header__secondary-nav {
grid-area: logo !important;
}
}
</style>The result
Community Blog Articles
Members of March '25
Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025
The power of automation: New Shopify Flow fundamentals learning path
Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025
Canadian merchants: Update account details by March 24, 2025 to continue us...
Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025