Shopify themes, liquid, logos, and UX
Hi there
The banner is too big on mobile, I believe this is due to the logo not changing size - any ideas how to fix?
Thanks!
Please share your website URL and password if any. I will check and provide a solution here.
Thanks!
Sorry for facing this issue, it's my pleasure to help us.
your store is password protect can you please share us
So I will check and provide a solution here.
Thanks guys, url is healhana.com and the preview is on https://w0sdwyel2km4s2tn-47542796440.shopifypreview.com.
Please let me know if you need anything else?
Thanks for the preview URL
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: 749px) {
#shopify-section-hero-2 .hero--large { height: 200px;}
.index-section--flush:first-child {margin-top: 70px;}
}
Thanks for your help guys, this worked and is almost there!
The only problem now is that the image is really small on mobile, is there a way to stretch it down? Or maybe select a different image for mobile view that will fit the screen better?
Looks like this now...
Ideally i would want the image to cover most of the screen, at least 70-80% of the space below the header.
Thanks!!
Sorry i think there was a bit of confusion here.
initially when i said banner, i actually meant heading. The heading size is too big for mobile and i believe it was due to the logo size.
BUT you did help me solve another issue of mine which was the image (banner) not resizing when going from desktop to mobile.
I hope this makes sense?
Thanks
thanks for confirm
yes is possible to upload different mobile image to customization code
How would i go about doing this?
Thanks!
It can be done by doing some code customization. please send me a personal message and we can discuss what you'd like
Hey,
I am also facing an issue where my banner on my mobile view is different than on my desktop view. For some reason the banner on my mobile is zoomed in.
Website - https://merches-kw.myshopify.com/
Password - merches
Can you please help me with this?
@healhana Happy to help you on this issue
Here is the simplest solution
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: 749px) {
div#Hero-hero-2 {
background-position: bottom !important;
background-size: contain;
height: auto;
display: block;
}
}
Hello,
I tried to do this, but it did not work. Can you help me out?
Thank yoU!!
store url please
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