Home Page Product Images Look Blurry - by R

This topic has 18 replies, 4 voices, and was last updated 3 years, 9 months ago ago by Olga Barlow

  • Avatar: G
    R
    Participant
    July 10, 2020 at 16:03

    My website home page images look blurry but when I click on the images to single product page, they look clear.. why is that?

    Please, contact administrator
    for this information.
    17 Answers
    Avatar: John Holden
    John Holden
    Support staff
    July 10, 2020 at 16:51

    Hi,

    You can change image size in Appearance > Customize > WooCommerce > Product Images https://docs.woocommerce.com/document/fixing-blurry-product-images/

    Regards,
    Hung PD

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    July 10, 2020 at 16:54

    Hello,

    Because your image is 200px height but you stretch it to 300px using custom CSS https://prnt.sc/tfgjou So, image looks blurred. Use the crop option of the woocommerce plugin (Theme Options > WooCommerce > Product images > crop) if you want to get the squared images, don’t use that custom.

    Regards

    Avatar: G
    R
    Participant
    August 12, 2020 at 02:52

    I’m so confused. I’ve tried that and they still show blurry 🙁 Why is it not working, what should the product imges height width be? I tried to use uncropped on woocommerce product images but it is still blurry on homepage and product page (some) but when you click on the image the image is large and looks fine… ?

    Please contact administrator
    for this information.
    Avatar: John Holden
    John Holden
    Support staff
    August 12, 2020 at 05:12

    Hi,

    It comes from Xstore Child Theme, please delete Custom CSS. Clear all cache and try again.

    Regards,
    Hung PD

    Avatar: G
    R
    Participant
    August 12, 2020 at 16:56

    I have tried and I’m still having trouble. Now it appears I have two XSTORE themes on my site. This is confusing.

    Avatar: G
    R
    Participant
    August 12, 2020 at 22:43

    You two are telling me two different things to do. I’m sorry but Olga seems to be more helpful as Hung you give random generic responses and are not really helpful.

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    August 13, 2020 at 12:08

    Hello,

    You are trying to stretch the image to 300px height even if the image is smaller than 300px. It makes them blurry http://prntscr.com/tyx6t5
    Remove the mentioned custom code from your child theme. Use crop option in WooCommerce settings if you want to get squared images on grid.

    Regards

    Avatar: G
    R
    Participant
    August 14, 2020 at 14:38

    I don’t know what that custom code is? I didn’t put it there. please help!!

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    August 14, 2020 at 16:09

    Connect to your child theme files through FTP and check style.css file there https://prnt.sc/tzn94c

    Regards

    Avatar: G
    R
    Participant
    August 14, 2020 at 23:51

    Ok I removed the code and it’s still blurry on home page :-/

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    August 15, 2020 at 06:59

    Hello,

    Make sure that you have cleared all cache.

    Regards

    Avatar: G
    R
    Participant
    August 17, 2020 at 23:28

    I did????

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    August 18, 2020 at 16:08

    Hello,

    Could you, please, enable the default WooCommerce theme Storefront (Appearance > Themes > install and activate) and check how that image looks with the Storefront? Because our theme does not have any additional settings for the images and I suppose that the shop page image looks blurry because itself, not because of our theme.

    Regards

    Avatar: G
    R
    Participant
    August 19, 2020 at 18:52

    I did that and the homepage thumbnail images are still blurry but when you click on the actual product and it takes you to the actual product page, the actual images are not blurry. This is very frustrating.

    Avatar: John Holden
    John Holden
    Support staff
    August 20, 2020 at 06:18

    Hi,

    Try to regenerate images using Regenerate thumbnails plugin.

    Regards,
    Hung PD

    Avatar: G
    R
    Participant
    August 24, 2020 at 17:28

    I did that and my images are still blurry and now they are also many different sizes on the home page (I’m not happy about that).

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    August 26, 2020 at 11:08

    Hello,

    Look, all the options available for the images you can find in Customizer > WooCommerce > Product Images. Our theme does not generate image sizes, WordPress does this. Our theme just allows to choose the size you want to show, that’s all. If your images do not look ok even with the default WP theme we can do nothing in this case. Sorry.

    Regards

  • Viewing 18 results - 1 through 18 (of 18 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.