How can I reduce the size of a slideshow photo on the Debut theme?

Store Design
1

Hi All!

I’ve searched as much as I could find but for some reason the slideshow is far too big on my site.

I want my site to look like this https://prnt.sc/1qf4ncv but at the moment it looks like this https://prnt.sc/1qf4nje

How do I edit the code so it isn’t so big?? If I edit the image size it just makes it all blurry and still the same size :disappointed_face:

I’ve tried searching around but nothing is helping so far…

Thanks!

1 Like
2

@KeelanM

Please add the following code at the bottom of your assets/theme.scss.liquid file.

@media only screen and (min-width: 750px){
.slideshow {max-height: 350px !important;}
}

Hope this works.

Thanks!

1 Like
3

Hey dmwwebartisan, It didn’t seem to do anything. I added this in assests/theme.css as the .liquid file has been replaced I think

4

@KeelanM

Please share your store URL .

Thanks!

1 Like
5

Shop URL is https://quickpuff.co.nz/ If it asks for a password it is “a”

6

@KeelanM

The recommended image size is 1200px to 2000px width, and 400px to 600px height. When switching to a mobile/small screen view there is some resizing and cropping that is done, so the image won’t be identical. I would recommend, when setting up the images for the slide, to make them middle aligned. This should make things look a bit better, as it will be the top/bottom and left/right that will get cropped out instead of part of the middle.

7

If you wrap the content in class="page-width" it will adhere to the normal content width instead of being full page.