Different main banner size for mobile vs desktop

[fitandfeminin]

Hey! 

Actually Im pretty lost at the moment... Maybe you can help me.

I need to change the image size of the main picture to extra large on desktop and to small on smartphone. 

Is something like this even possible? 

Best regards

[Brie · Accepted solution]

Hi, @fitandfeminin! 

What theme are you using? Depending on your theme and paid plan, our themes team may be able to assist you with that change (see our Design Policy). To look into that further for you, I will just need to verify the account. If you would like me to get that process started, please reply here and let me know.

Thank you! 

[fitandfeminin]

Im using the debut theme. This would be great!

[Brie]

Hi, @fitandfeminin! 

Okay, great. I've just sent you an email, so if you'd like to respond there then I can look into that for you. Thank you! 

[sai2810]

Hey im using Narrative theme and while im trying to add the main banner to the site its not fitting to mobile properly ,so i just want to use different banners for desktop and mobile.can someone help?

[Brie]

Hi, @sai2810! 

A Banner section isn't built into the Narrative theme, so you may be referring to the Slideshow section. If so, it wouldn't be possible to for us to implement different slideshow images on mobile and desktop as it would require quite a bit of custom coding. Your best option here would be to find an image that suits both device types. Here are some additional tips to help with that:

- Use images that are 4000 x 2200 px or larger. 

- Read up on best practices for uploading slideshow images here. We also have a video here that goes over this.

- Refrain from uploading images with text on them (text options are instead added in the Theme Editor). 

- Set the slide heights to "Adapt to first image", which allows for a more flexible container. 

The site is designed for the image container to respond and change depending on the type of screen it's loaded on. For more information on troubleshooting slideshow image cropping, you can take a look at this blog post. 

Hope that helps!  

[dor-collections]

Hi!

So I'm using the theme, "Minimal" and I am having issues with my banner fitting the mobile v. desktop. I am currently using Slideshow for the banner and it is 2500 x 1000 px. I also tried 3420 x 3420 and it was the same result. Can you help me figure out how to fix this issue? My banner is cut off on both sides when switched to Mobile format. 

Thanks

[Brie]

Hi, @dor-collections!

The recommended size for slideshow images for the Minimal theme is 1280 x 460 px. Give that a try and let me know how it goes. Cheers!

[Lingeriebyatg]

Hi There 

I am using Brooklyn theme and I’m also having trouble with the above. 

My Slide shows, show differently on Computer to mobile. Is there a way to fix this or a proper dimension I should be using? 

[Brie]

Hey, @Lingeriebyatg!

The recommended dimensions for slideshow images on the Brooklyn theme would be 3840 x 2160 px or larger (without exceeding the upload limits). That said, it's expected for your images to look different from the computer to mobile view, as they need to adapt to fit different screen sizes. If you aren't able to find an image that adapts for both versions in a way that suits you, you can choose to have a different image added for one view or the other (requires custom coding). If you still have Design Time left, that's something our Themes team can give you a hand with. 

[HouseandHive]

Hello, I am using the Debut theme, and I am having an issue with banner size in mobile vs. desktop. Is it possible to resize the "Image with text overlay" so that it displays properly in mobile versus desktop. If so, what size should I make the image? 

Thank you.