Shopify themes, liquid, logos, and UX
How do I move the logo slightly to the right so that it is not ontop of the menu?
The logo and menu drop down works fine on the homepage but not any of our other pages
The logo is perfect on desktop view.
Thank you
Reggie
Solved! Go to the solution
This is an accepted solution.
hi @ReggieBaby
You can try this code by following these steps:
Go to Online store => themes => actions => edit code and add this code on file theme.liquid before tag </body>
<style>
@media screen and (max-width: 767px){
header.header.header--middle-left.page-width.header--has-menu {
display: grid;
grid-template-areas: 'left-icon heading icons';
grid-template-columns: 1fr 2fr 1fr !important;
}
}
</style>
Hope this answer helps.
Best regards,
Victor | PageFly
This is an accepted solution.
hi @ReggieBaby
You can try this code by following these steps:
Go to Online store => themes => actions => edit code and add this code on file theme.liquid before tag </body>
<style>
@media screen and (max-width: 767px){
header.header.header--middle-left.page-width.header--has-menu {
display: grid;
grid-template-areas: 'left-icon heading icons';
grid-template-columns: 1fr 2fr 1fr !important;
}
}
</style>
Hope this answer helps.
Best regards,
Victor | PageFly
Hello @ReggieBaby
I would like to give you the recommendation to support you so kindly follow steps below:
1. Go to your Online store > Themes > Edit code
2. Open your theme.liquid file
3. Paste the below code before </body>
{% unless template contains 'index' %}
<style>
@media(max-width:768px){
header > a.header__heading-link{
margin-left: 0px !important;
}
}
</style>
{% endunless %}
I hope the above is useful to you.
Best regards,
GemPages Support Team
Hi @ReggieBaby
I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.
Please add this css in your bottom of the css file:
@media (max-width: 768px) {
h1.header__heading {margin-left: 50% !important; width: 28%;}
}
Regards,
San
If it’s helpful to you, please mark it as a solution.
Need Help with Shopify Design, Migration, Speed, or Custom tasks?
email: hi@mswebdesigner.com
Try Our Conversion Booster app to get more sales | Connect Our Founder Linkedin
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024