Why is my image slide losing quality on desktop view?

Store Design
1

Hi! i have a problem at uploading photos at one ‘‘image slide’’ option in my store here in Shopify, images looks really good in quality and size terms for mobile platform, but when you look it trought one computer, those images are resized and amplifyed, loosing a lot of quality.

Also i’m making sure that i’m following the right steps to upload images respecting the therms, somebody can help me at solving my problem? thanks in advance to everyone!

Ernest.

2

Hi Ernest,

This requires some CSS fix for image like object-fit: cover
CSS property needs to be added in the image class.

something like this

.some-image-class{
 object-fit: cover;
}
3

Hey Hafiz! thanks for your time!

sorry but it wasn’t an ‘‘image slide’’ it is an ‘‘slideshow’’ where i have my problem for images at labtop/computer, should i use the same code or you can bring me another one to solve it ?:slight_smile:

4

Please share your store URL, So i can look closely

5

sorry i press the button ‘‘accepted as a solution’’ but i tried the code you posted and it doesnt work, here you have the link of the store to figure it out the problem at looking trought all platforms!

(Just to provide you more information, images are uploaded at 2048x2048 pixels size, as Shopify recommends.

https://suplifystore.myshopify.com/

thanks in advance!

Ernest.

6

After checking the store I will suggest you resize the banner following Shopify’s best practices guideline about banners here:

HafizFahadMunir_0-1702150320832.png
HafizFahadMunir_0-1702150320832.png2132×1448 356 KB

https://www.shopify.com/blog/image-sizes

If we fix it using code for some banners then it may not work for all banners of different sizes and this may bring down the first impression of the store.

Equal size of all banners following Shopify’s recommendation will be the best solution.

7

Hey Hafiz! i reply you here in order to continue our conversation trought private messages because Shopify doesn’t me reply you there again, sorry!

Thanks a lot in advance! So how we can solve it? There’s a price that I have to pay you or you can do it for free in your free time? Also, I want to ask you if you work with Shopify, can I use those free minutes that I have to check with the design team at start designing a shop? Tell me and we discuss about it :slight_smile:
Thanks a lot!

1 Like