Blurry image problems

  • Resolved wonderwooman

    (@wonderwooman)


    9 months, 3 weeks ago

    I’m experiencing blurry product images in the store including product images, catalog and product page thumbnails. I’ve read through posts and followed the instructions but I couldn’t resolve the problem. https://snipboard.io/h3uVUQ.jpg

    Here are info and settings in WordPress:
    Astra Theme Image Container:
    Single product image: 600×600
    Catalog thumbnail: 222×222
    Product page thumbnail: 137×137
    WP Gallery Settings:
    Thumbnail: 150×150
    Medium: 300×300
    Large: 1200×1200
    WooCommerce Settings:
    Main image width: 800
    Thumbnail width: 300

    The uploaded images are 1200x1200px.
    I have done the following, but they didn’t make any difference:

    –All plugins are up to date.
    –Deactivated any image-related plugins (no image compression).
    –Changed to the Storefront theme.
    –Changed the image width to 600/900/1000 and regenerated shop thumbnails.
    –Cleared cache.

    I also added the same image (1200px) in a blog post, and it is not as good as the image in the library, but the image on the product page, however, looks much duller and blurrier. https://snipboard.io/Zy2x8K.jpg

    Another issue caused by changing the image width is that images of different sizes are being created but will never be used. How can I get rid of them easily and safely? https://snipboard.io/fs3C5e.jpg

    Any help would be appreciated.

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hi there @wonderwooman.

    Thanks for reaching out.

    Looking at the settings shared from your Astra theme and WooCommerce, it is possible the issue is related to the settings not matching.

    The Astra theme recommends a single product image size of 600×600, but in your WooCommerce settings, your main image width is set to 800. This could be causing the blurriness as the images are being resized.

    Try adjusting the main image width in your WooCommerce settings to match the 600×600 recommendation from the Astra theme. After making this change, you can then regenerate your thumbnails with the help of a plugin like this one or this one.

    Another issue caused by changing the image width is that images of different sizes are being created but will never be used.

    It is likely another images is created by WordPress for different screen sizes or due to your theme setup. If you want to remove those, you can use a plugin like this one, which will remove all old image sizes and only generate the new ones you’ve specified.

    Remember to clear your cache after making these changes, and then check to see if your images are displaying correctly.

    Let us know how it goes.

    Thread Starter wonderwooman

    (@wonderwooman)

    Hi @ckadenge

    As someone new to website setup, I truly appreciate all your help. It has made a significant difference. While the 600px product images are still somewhat blurry, the hover zoom images have improved and are now acceptable.

    Using your recommendation to regenerate thumbnails, I’ve recovered almost 5GB of space!

    Thank you once again for your invaluable assistance.

    Plugin Support Shameem R. a11n

    (@shameemreza)

    Hi @wonderwooman

    I’m glad to hear that @ckadenge’s solutions have made a significant difference and that you’ve recovered a substantial amount of space.

    While the 600px product images are still somewhat blurry, the hover zoom images have improved and are now acceptable.

    It could be due to the quality of the original image. Make sure your original images are high-quality and clear before uploading. Also, ensure that the original image size is not smaller than the size you want it to display on your website, as this can cause pixelation and blurriness.

    I will mark this thread as resolved. Should you have further inquiries, kindly create a new topic here.

    Meanwhile, if you have a moment to spare, we would love it if you could share your thoughts with us by leaving a review or feedback. Your experience and feedback are important to help us improve and ensure we’re always providing the best possible support.

    Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Blurry image problems’ is closed to new replies.