Tagged: , , ,

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • January 12, 2023 at 6:31 pm #1378465
    envato99

    Hi team,

    If I open a Product by clicking on a link in the Categories sidebar, I get what looks like a low-resolution image. That is to say, it looks quite blurry.

    However, if I use the Search Box to find the product, and then click on the link to it in the search results, I get what looks like a higher-resolution image.

    Is there any way to fix it so that both product listings show the high-resolution image?

    Thanks,
    Stephen.

    January 13, 2023 at 8:04 am #1378523
    Ismael

    Hey Stephen,

    Thank you for the inquiry.

    You can add the following code in the functions.php file to adjust the size of the catalogue images.

    add_filter( 'avf_wc_before_shop_loop_item_title_img_size', 'avf_wc_before_shop_loop_item_title_img_size_mod', 10, 1 );
function avf_wc_before_shop_loop_item_title_img_size_mod( $thumbnail_size ) {
    return 'woocommerce_thumbnail';
}

    Best regards,
    Ismael

    January 13, 2023 at 1:36 pm #1378582
    envato99

    Thanks Ismael.

    I don’t really see a change in the image quality I’m afraid.

    Do I need to edit the above code / define the pixel dimensions for the image? (I don’t know PHP.)

    I think the root cause of the problem is that the listing I get when I click on the product from the CATEGORIES sidebar is loading a smaller image (In absolute pixel dimensions) and then upscaling it.

    You can see the difference if you load this product:

    I Love Nicola Mug

    And then search for it [I Love Nicola] and click on the listing that is returned there.

    Thanks,

    Stephen.

    January 13, 2023 at 5:15 pm #1378621
    envato99

    Ismael — looking again at this:

    a) The default page for a product displays an image sized 450×450 pixels.

    Example:

    https://rgb-design.co.uk/wp-content/uploads/2023/01/Default-Product-Image-Which-is-Low-Quality.jpg

    b) Whereas when I load up the same page from search results, it loads a bigger image (I think 1030×1030) into a container that”s about the same size as in a), above. The image appears much clearer / better. Ideally, I would like the default product page to be the same, if possible.

    Example:
    https://rgb-design.co.uk/wp-content/uploads/2023/01/How-the-Product-Image-Should-Look.jpg

    (My screen resolution is 2560 x 1440 if that makes a difference.)

    Cheers,

    Stephen.

    • This reply was modified 1 year, 11 months ago by envato99.
    • This reply was modified 1 year, 11 months ago by envato99. Reason: EDITED Saturday 14th Jan — inserted link to 2 images showing the difference in quality
    January 17, 2023 at 7:21 am #1388011
    Ismael

    Hi!

    Thank you for the update.

    There was an error in the code above, but we already corrected it. Please try it again. The filter should disable the default thumbnail (450x450px) that is enforce by the theme and revert it back to the default woocommerce_thumbnail, which automatically adjusts based on the selected options in the Appearance > Customize > Woocommerce > Product Images panell.

    Regards,
    Ismael

    January 17, 2023 at 11:45 am #1388027
    envato99

    Apologies Ismael. By mistake I had commented out the fix in my functions. php file. It works correctly now.

    Cheers,
    Stephen.

    January 17, 2023 at 12:12 pm #1388031
    Ismael

    Hi,

    No problem. Glad to know that the issue has been resolved. Please do not hesitate to open another thread if you have more questions about the theme.

    Have a nice day.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘WooCommerce shop — different image quality depending on how I open the product.’ is closed to new replies.