Slideshow images look sharp on mobile but appear enlarged and blurry on desktop. Images were uploaded at 2048×2048 px (per Shopify guidance), but desktop scaling degrades quality.
Initial attempt: A CSS fix was suggested (object-fit: cover) to control how images fill their container. After clarification that the issue is with a “slideshow,” the code was tried but did not resolve the problem; acceptance was clicked by mistake.
Review and recommendation: After checking the store URL (suplifystore.myshopify.com), the advice is to standardize banner dimensions following Shopify’s best‑practice image size guidelines. Reason: a CSS-only approach may not work consistently across differently sized banners and could harm the site’s visual consistency. A link to Shopify’s image size guide and a reference screenshot were provided.
Status/outcome: No final fix applied yet. Next step is to resize/replace slideshow banners to recommended dimensions for desktop. The conversation is moving to private messages to discuss potential assistance, including possible paid help or using available Shopify design time. Discussion remains open.
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.
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;
}
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 ?
Please share your store URL, So i can look closely
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.
After checking the store I will suggest you resize the banner following Shopify’s best practices guideline about banners here:
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.
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
Thanks a lot!
