Hi! I’m wondering if there’s a way to have 2 different banners, one for web and one for mobile, without having to change the code every time? If I have to change code, could someone please instruct me how to do it?
I would want the mobile version to be more square so it fits the screen better without cutting off the text.
Thanks a lot!!
Its a customization task can you share your store password?
Ah sorry!
nevy.co.kr
nevytesting123
Hi @mayanevy ,
We need to create separate image upload options for mobile and desktop. To create this we need to customize the slider.liquid code
Could you please let me know how to do it?
Image 2 Banners Separate image banners are possible on mobiles and desktops will have separate image banners.
You have to go to section-image-banner.css file and implement the code
#Banner-template–18085329371422__d8ec64f4-80b3-4690-9b5b-03f902d20305 {
display:none;
}
@media screen and (max-width: 749px) {
#Banner-template–18085329371422__d8ec64f4-80b3-4690-9b5b-03f902d20305 {
display:flex;
}
}
#Banner-template–18085329371422__image_banner{
display:flex;
}
@media screen and (max-width: 749px) {
#Banner-template–18085329371422__image_banner {
display:none;
}
}
Thank you! Will I have to change this code every time I change banner image?
You don’t need to change code every time
I added the code but nothing seems to be different. Can you help me how to set it up?
Do I have to upload 2 different sizes of banners on the website?
Yes, you have to upload two banners. One is for desktop and another one for mobile
I don’t think I understand how to upload the banners properly. I uploaded 2 in different sizes but both show up.
I don’t think I understand how to upload the banners properly. I uploaded 2 in different sizes but both show up..
