Shopify porto theme desktop banner and mobile banner

Hi there, I have Porto theme on Shopify. I noticed that the desktop website banner doesn’t display correctly in the mobile view. So question to you is How do I get the mobile view to adjust automatically? Or, How do I set different banners for desktop view and mobile view?

For both, I don’t know where to code this or what the code is.

Can someone help with the code and where it needs to be placed? Thanks

Hi @Sri2

Could you share your store URL so I can check?

Hi there, website URL is https://karunadawn.com.au

I recommend you creat another image for mobile device, because if we add code to make image look same on desktop then it will be like this

Thank you but how do I code it so that the mobile banner appears when viewing on mobile? What code do I use to do this?

Creating the other mobile image is not the problem - it’s coding so that I’m able to use 2 different banners. I hope that explains it better.

You can create a banner for your mobile and then add this code to your theme.liquid file, after in Online Store

@media (max-width: 749px){
#shopify-section-1495691614906 .slide-bg {
    background-image: url(your-image-banner-for-mobil-url) !important;
}
}

Thank you I’ll give it a try.