How to have images autoscale on slider with Brooklyn Theme?

Highlighted
New Member
2 0 0

So I'm using the Brooklyn theme right now, and on the front page there's the slider with two product images rotating. I have been able to decrease the size of the slider in total, but right now when I upload an image only a corner or so is shown, the rest just falls off the page. I was wondering if there's a way to auto scale images, so that for example it automatically decreases the size by 50% or so? Here's an example of what I'm having right now:

 

As you can see, the image only shows a part of the cup that I used as an example to sell. The image that it should be showing is this:

 

How can I make it so that the entire image is shown? I can't just go and make the image bigger, as online converter sites only go down.

0 Likes
Highlighted
Shopify Staff
Shopify Staff
150 0 14

Hi, Sjuul!

This is Martha from the Shopify Team. 

To make images on your slideshow appear as best they can, you should stick to the
slideshow specifications for your theme. The Brooklyn ones are listed here.

The Brooklyn theme is responsive, so it adjusts to different devices and screens. This means that the images displayed in the slideshow will shift a bit from mobile, to desktop and in between! The ideal/ recommended size of the slideshow image is 1200px wide, from here you would want to choose a focal point of your image and make is central within the image file. So, for your example, this might be the kitten nose! 

Once you've got the image all set, save and reupload to the slideshow section and test it out in a few windows. This can take a little finessing to get exactly the look you're after, but hopefully, these details help :)

If you have any further questions or need some help, feel free to reach out to us over email - support@shopify.com! Brooklyn is a Shopify-made theme so, some minor coding adjustments can be requested to our Themes team as well.

Cheers, 
Martha

0 Likes
Highlighted
New Member
1 0 0

For what it's worth, this "fix" doesn't work on the new Brooklyn theme. As of July 2018. 

0 Likes
Highlighted
Shopify Staff
Shopify Staff
575 18 74

Hi, All.

This is Max from the Shopify Team. 

The recommended size for the Brooklyn theme has been adjusted slightly. The link Martha shared last year links to the correct section of the updated documentation. Check that out here. The change is the larger the better with an example of 3840 x 2160 px or larger while still keeping in mind that there is a file upload limit

The other details about a finding a focal point and testing in multiple screen sizes to see how that shifts the display is still relevant! If anyone did need a hand with this theme's slideshow, or anything else, please let us know!

Cheers, 
Max
support@shopify.com

Max | Social Care @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

1 Like
Highlighted
New Member
1 0 0

Hi,

is there a way to have slider images auto scale for optimal view of the whole image without cropping on a mobile device?

help would be appreciated greatly.

 

thanks.

0 Likes