Liquid, JavaScript, themes, sales channels
Hi all,
Our font size on our site (www.illuminate-food.com) looks great on desktop, but it's tiny and unreadable on mobile. I cannot figure out how to fix it. In typography, I'm at the max size, and coding suggestions on other forums don't seem to work.
See screenshots below (which, by the way, are entirely different than the Shopify mobile preview when editing my theme). Please let me know if you can help - much appreciated!
Shayna
Solved! Go to the solution
This is an accepted solution.
Hello There,
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
@media only screen and (max-width:767px) {
h1.Header__Logo .Header__LogoImage {
max-width: 140px;
}
}
This is an accepted solution.
@sventricelli
Don't forget to delete the code you added on the screenshot you shared. It's in the wrong place and It may break your theme. (everything below </html>)
Kind regards,
Diego
Hello There,
Add this code in head tag
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
Screenshot :- https://prnt.sc/107e4yw
@ZestardTech THANK YOU! This worked. The only thing it did not change is the size of the logo, in the center of the header. Any ideas on that?
Hello There,
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
@media screen and (max-width:767px){
h1.Header__Logo .Header__LogoImage {
max-width: 140px;
}
}
Thanks so much again! That one doesn't seem to work for me. Did I do something incorrectly?
This is an accepted solution.
Hello There,
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
@media only screen and (max-width:767px) {
h1.Header__Logo .Header__LogoImage {
max-width: 140px;
}
}
Hey there thanks for sharing ! At the contrary,
- Do you know the code for display only on desktop ?
- And to not display at all for exemple (desktop or mobile)
Thanks a lot,
Using the same thème Prestige 🙂
This is an accepted solution.
@sventricelli
Don't forget to delete the code you added on the screenshot you shared. It's in the wrong place and It may break your theme. (everything below </html>)
Kind regards,
Diego
Kindly feel free to get back to me if you need any further assistance Thanks!
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