Shopify themes, liquid, logos, and UX
I have the dawn theme.
on the homepage I have a image banner with a pink button overlay showing on the desktop, but on the mobile version it’s transparent and black.
I would like it to show up as it is on the desktop version.
Sorry you are facing this issue, it would be my pleasure to help you.
Welcome to the Shopify community!😊
Thanks for your good question.
Please share your site URL,
I will check out the issue and provide you a solution here.
Hi Ketan,
Can you help me with the same query? I would like the colour block that appears on desktop to also display on mobile.
My url is https://tesss-astbury-test.myshopify.com/
Many thanks,
Tess
sorry for that issue can you try this code
1. Go to Online Store->Theme->Edit code
2. Asset->/section-image-banner.css ->paste below code at the bottom of the file.
.banner__buttons a.button.button--primary {
opacity: 1;
background: #000;
color: #fff;
}
Hi Ketan,
Thanks so much for this. Apologies for not being clearer – I'm actually needing the whole coloured box surrounding all of the the text and buttons to appear on mobile.
Can you help?
Many thanks,
Tess
yes please check your theme setting color option it allow this
Thanks Ketan. The colour is set in theme settings, but won't display on mobile.
Is there some code that will make the whole block appear on mobile rather than just the button?
Many thanks.
do you mean like this?
Hi Ketan,
Sorry for not being clearer. I mean like this:
Many thanks.
yes please try this code
1. Go to Online Store->Theme->Edit code
2. Asset->/section-image-banner.css ->paste below code at the bottom of the file.
@media screen and (max-width: 749px) {
.banner:not(.banner--mobile-bottom) .banner__box {background-color: #000;}
}
That's exactly what I wanted, thanks Ketan!
its my pleasure to help us
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