[Support request] woocommerce images in gallery blurry

[John MacKenzie]

ok so ive done a bit of work on other threads working with the image sizes etc but we still cant get the images to NOT be blurry.
link in notes is there anyway to have not blurry images but also have them appear as the same square size?

thanks!
John

[Leo]

Hi there,

The issue is definitely coming from this CSS you’ve added:

@media(min-width: 769px) {
    .woocommerce ul.products li.product a img {
        width: 250px !important;
        height: 250px !important; 
    }
}

I’m not aware of a CSS solution to keep them square and not changing the quality at the same time unfortunately.

The best solution would be to upload images that are already in 1:1 ratio (square) so you can use either width or height property in the CSS to avoid the blurry-ness.

[John MacKenzie]

ok thanks, its going to be a marketplace so multiple vendors uploading images so thats going not be possible

so its not possible then? as long as i know i can tell my client.

Thanks
John

[Leo]

Unfortunately not.

Restricting both width and height property with CSS doesn’t really work well.

[John MacKenzie]

ok thanks,can the images be zoomed instead somehow using something other than css then that still makes them cropped and square, but not blurry?

thanks
John

[David]

Hi there,

unfortunately there isn’t a lot that can be done when dealing with lots of irregular size images.

I did find this plugin – haven’t tested it but may be worth a shot:

https://wordpress.org/plugins/smart-image-resize/

[Author]

Posts