Shop thumbnail images very blurry after update to 3.3.2

  • Resolved olga1706

    (@olga1706)


    6 years, 8 months ago

    Hi,

    After latest WooCommerce update shop thumbnail images (below the main product image/single product) look very blurry. I have regenerated thumbnails but it didn’t change anything. I can’t think what else I can do to fix it.
    Can you assist please.

    Thanks,
    Olga 

    
### WordPress Environment ###

Home URL: https://www.olenkadesign.co.uk
Site URL: https://www.olenkadesign.co.uk
WC Version: 3.3.3
Log Directory Writable: ?
WP Version: 4.9.4
WP Multisite: –
WP Memory Limit: 512 MB
WP Debug Mode: –
WP Cron: ?
Language: en_US

### Server Environment ###

Server Info: Apache
PHP Version: 7.0.27
PHP Post Max Size: 256 MB
PHP Time Limit: 300
PHP Max Input Vars: 5000
cURL Version: 7.54.0
OpenSSL/1.0.2k

SUHOSIN Installed: –
MySQL Version: 5.6.38
Max Upload Size: 256 MB
Default Timezone is UTC: ?
fsockopen/cURL: ?
SoapClient: ?
DOMDocument: ?
GZip: ?
Multibyte String: ?
Remote Post: ?
Remote Get: ?

### Database ###

WC Database Version: 3.3.3
WC Database Prefix: wp_
Total Database Size: 9.18MB
Database Data Size: 6.40MB
Database Index Size: 2.78MB
wp_woocommerce_sessions: Data: 0.01MB + Index: 0.00MB
wp_woocommerce_api_keys: Data: 0.02MB + Index: 0.03MB
wp_woocommerce_attribute_taxonomies: Data: 0.00MB + Index: 0.00MB
wp_woocommerce_downloadable_product_permissions: Data: 0.00MB + Index: 0.00MB
wp_woocommerce_order_items: Data: 0.00MB + Index: 0.00MB
wp_woocommerce_order_itemmeta: Data: 0.00MB + Index: 0.01MB
wp_woocommerce_tax_rates: Data: 0.00MB + Index: 0.01MB
wp_woocommerce_tax_rate_locations: Data: 0.00MB + Index: 0.00MB
wp_woocommerce_shipping_zones: Data: 0.00MB + Index: 0.00MB
wp_woocommerce_shipping_zone_locations: Data: 0.00MB + Index: 0.00MB
wp_woocommerce_shipping_zone_methods: Data: 0.00MB + Index: 0.00MB
wp_woocommerce_payment_tokens: Data: 0.00MB + Index: 0.00MB
wp_woocommerce_payment_tokenmeta: Data: 0.00MB + Index: 0.00MB
wp_woocommerce_log: Data: 0.00MB + Index: 0.00MB
wpstg0_commentmeta: Data: 0.00MB + Index: 0.00MB
wpstg0_comments: Data: 0.00MB + Index: 0.01MB
wpstg0_failed_jobs: Data: 0.00MB + Index: 0.00MB
wpstg0_links: Data: 0.00MB + Index: 0.00MB
wpstg0_mailchimp_carts: Data: 0.00MB + Index: 0.00MB
wpstg0_mo_campaign_log: Data: 0.00MB + Index: 0.00MB
wpstg0_mo_campaign_logmeta: Data: 0.00MB + Index: 0.00MB
wpstg0_mo_conversions: Data: 0.00MB + Index: 0.00MB
wpstg0_mo_email_campaigns: Data: 0.00MB + Index: 0.00MB
wpstg0_mo_optin_campaignmeta: Data: 0.00MB + Index: 0.00MB
wpstg0_mo_optin_campaigns: Data: 0.00MB + Index: 0.00MB
wpstg0_options: Data: 1.09MB + Index: 0.07MB
wpstg0_postmeta: Data: 0.30MB + Index: 0.07MB
wpstg0_posts: Data: 0.16MB + Index: 0.04MB
wpstg0_pp_call_to_action_groups: Data: 0.00MB + Index: 0.01MB
wpstg0_pp_customizations: Data: 0.37MB + Index: 0.14MB
wpstg0_pp_designs: Data: 0.00MB + Index: 0.00MB
wpstg0_pp_entities_images: Data: 0.00MB + Index: 0.01MB
wpstg0_pp_forms: Data: 0.00MB + Index: 0.01MB
wpstg0_pp_form_submissions: Data: 0.00MB + Index: 0.01MB
wpstg0_pp_images: Data: 0.01MB + Index: 0.03MB
wpstg0_pp_layout_entities: Data: 0.03MB + Index: 0.03MB
wpstg0_pp_layout_meta: Data: 0.04MB + Index: 0.04MB
wpstg0_pp_menus: Data: 0.00MB + Index: 0.00MB
wpstg0_pp_menu_items: Data: 0.01MB + Index: 0.01MB
wpstg0_pp_menu_item_instances: Data: 0.01MB + Index: 0.02MB
wpstg0_pp_menu_item_types: Data: 0.00MB + Index: 0.00MB
wpstg0_pp_migrations: Data: 0.02MB + Index: 0.00MB
wpstg0_pp_taxonomies: Data: 0.00MB + Index: 0.00MB
wpstg0_pp_templates: Data: 0.01MB + Index: 0.01MB
wpstg0_pp_templates_customization_parents: Data: 0.45MB + Index: 0.57MB
wpstg0_pp_template_entities: Data: 0.11MB + Index: 0.12MB
wpstg0_pp_tiles: Data: 0.45MB + Index: 0.01MB
wpstg0_queue: Data: 0.00MB + Index: 0.00MB
wpstg0_say_what_strings: Data: 0.00MB + Index: 0.00MB
wpstg0_termmeta: Data: 0.00MB + Index: 0.01MB
wpstg0_terms: Data: 0.00MB + Index: 0.01MB
wpstg0_term_relationships: Data: 0.00MB + Index: 0.01MB
wpstg0_term_taxonomy: Data: 0.00MB + Index: 0.00MB
wpstg0_usermeta: Data: 0.02MB + Index: 0.02MB
wpstg0_users: Data: 0.00MB + Index: 0.01MB
wpstg0_wc_download_log: Data: 0.00MB + Index: 0.00MB
wpstg0_wc_webhooks: Data: 0.00MB + Index: 0.00MB
wpstg0_woocommerce_api_keys: Data: 0.02MB + Index: 0.03MB
wpstg0_woocommerce_attribute_taxonomies: Data: 0.00MB + Index: 0.00MB
wpstg0_woocommerce_downloadable_product_permissions: Data: 0.00MB + Index: 0.00MB
wpstg0_woocommerce_log: Data: 0.00MB + Index: 0.00MB
wpstg0_woocommerce_order_itemmeta: Data: 0.00MB + Index: 0.01MB
wpstg0_woocommerce_order_items: Data: 0.00MB + Index: 0.00MB
wpstg0_woocommerce_payment_tokenmeta: Data: 0.00MB + Index: 0.00MB
wpstg0_woocommerce_payment_tokens: Data: 0.00MB + Index: 0.00MB
wpstg0_woocommerce_sessions: Data: 0.00MB + Index: 0.00MB
wpstg0_woocommerce_shipping_zones: Data: 0.00MB + Index: 0.00MB
wpstg0_woocommerce_shipping_zone_locations: Data: 0.00MB + Index: 0.00MB
wpstg0_woocommerce_shipping_zone_methods: Data: 0.00MB + Index: 0.00MB
wpstg0_woocommerce_tax_rates: Data: 0.00MB + Index: 0.01MB
wpstg0_woocommerce_tax_rate_locations: Data: 0.00MB + Index: 0.00MB
wpstg0_yoast_seo_links: Data: 0.00MB + Index: 0.00MB
wpstg0_yoast_seo_meta: Data: 0.00MB + Index: 0.01MB
wp_commentmeta: Data: 0.00MB + Index: 0.00MB
wp_comments: Data: 0.00MB + Index: 0.01MB
wp_failed_jobs: Data: 0.00MB + Index: 0.00MB
wp_links: Data: 0.00MB + Index: 0.00MB
wp_mailchimp_carts: Data: 0.00MB + Index: 0.00MB
wp_mo_campaign_log: Data: 0.00MB + Index: 0.00MB
wp_mo_campaign_logmeta: Data: 0.00MB + Index: 0.00MB
wp_mo_conversions: Data: 0.00MB + Index: 0.00MB
wp_mo_email_campaigns: Data: 0.00MB + Index: 0.00MB
wp_mo_optin_campaignmeta: Data: 0.00MB + Index: 0.00MB
wp_mo_optin_campaigns: Data: 0.00MB + Index: 0.00MB
wp_options: Data: 1.15MB + Index: 0.07MB
wp_postmeta: Data: 0.30MB + Index: 0.07MB
wp_posts: Data: 0.19MB + Index: 0.05MB
wp_pp_call_to_action_groups: Data: 0.00MB + Index: 0.01MB
wp_pp_customizations: Data: 0.39MB + Index: 0.14MB
wp_pp_designs: Data: 0.00MB + Index: 0.00MB
wp_pp_entities_images: Data: 0.00MB + Index: 0.01MB
wp_pp_forms: Data: 0.00MB + Index: 0.01MB
wp_pp_form_submissions: Data: 0.00MB + Index: 0.01MB
wp_pp_images: Data: 0.02MB + Index: 0.03MB
wp_pp_layout_entities: Data: 0.03MB + Index: 0.03MB
wp_pp_layout_meta: Data: 0.04MB + Index: 0.04MB
wp_pp_menus: Data: 0.00MB + Index: 0.00MB
wp_pp_menu_items: Data: 0.01MB + Index: 0.01MB
wp_pp_menu_item_instances: Data: 0.01MB + Index: 0.02MB
wp_pp_menu_item_types: Data: 0.00MB + Index: 0.00MB
wp_pp_migrations: Data: 0.02MB + Index: 0.00MB
wp_pp_taxonomies: Data: 0.00MB + Index: 0.00MB
wp_pp_templates: Data: 0.01MB + Index: 0.01MB
wp_pp_templates_customization_parents: Data: 0.49MB + Index: 0.63MB
wp_pp_template_entities: Data: 0.12MB + Index: 0.17MB
wp_pp_tiles: Data: 0.47MB + Index: 0.01MB
wp_queue: Data: 0.00MB + Index: 0.00MB
wp_say_what_strings: Data: 0.00MB + Index: 0.00MB
wp_termmeta: Data: 0.00MB + Index: 0.01MB
wp_terms: Data: 0.00MB + Index: 0.01MB
wp_term_relationships: Data: 0.00MB + Index: 0.01MB
wp_term_taxonomy: Data: 0.00MB + Index: 0.00MB
wp_usermeta: Data: 0.02MB + Index: 0.02MB
wp_users: Data: 0.00MB + Index: 0.01MB
wp_wc_download_log: Data: 0.00MB + Index: 0.00MB
wp_wc_webhooks: Data: 0.00MB + Index: 0.00MB
wp_yoast_seo_links: Data: 0.00MB + Index: 0.00MB
wp_yoast_seo_meta: Data: 0.00MB + Index: 0.01MB

### Post Type Counts ###

attachment: 99
customize_changeset: 7
nav_menu_item: 18
page: 15
post: 1
pp_gallery: 4
product: 18
revision: 120
shop_order: 2
slide: 5
tt_font_control: 1
wafs: 1
wooframework: 18

### Security ###

Secure connection (HTTPS): ?
Hide errors from visitors: ?

### Active Plugins (16) ###

Developer: by Automattic – 1.2.6
Functionality: by Shea Bunge – 1.2.0
Woocommerce Hide Add To Cart Button: by WPProcare – 1.3 – Not tested with the active version of WooCommerce
MailChimp for WooCommerce: by MailChimp – 2.1.4 – Not tested with the active version of WooCommerce
MailChimp Forms by MailMunch: by MailMunch – 3.1.0
ProPhoto 6 Installer: by ProPhoto – 6.0.13
Really Simple SSL: by Rogier Lankhorst – 2.5.25
Regenerate Thumbnails: by Alex Mills (Viper007Bond) – 3.0.2
Simply Show IDs: by Matt Martz – 1.3.3
Cookie Consent: by Catapult_Themes – 2.3.9
W3 Total Cache: by Frederick Townes – 0.9.6
WooCommerce Advanced Free Shipping: by Jeroen Sormani – 1.1.3 – Not tested with the active version of WooCommerce
WooCommerce Social Media Share Buttons: by Toastie Studio – 1.3.0 – Not tested with the active version of WooCommerce
WooCommerce: by Automattic – 3.3.3
Yoast SEO: by Team Yoast – 6.3.1
WP Staging: by WP-Staging – 2.1.8

### Settings ###

API Enabled: ?
Force SSL: ?
Currency: GBP (￡)
Currency Position: left
Thousand Separator: ,
Decimal Separator: .
Number of Decimals: 2
Taxonomies: Product Types: external (external)
grouped (grouped)
simple (simple)
variable (variable)

Taxonomies: Product Visibility: exclude-from-catalog (exclude-from-catalog)
exclude-from-search (exclude-from-search)
featured (featured)
outofstock (outofstock)
rated-1 (rated-1)
rated-2 (rated-2)
rated-3 (rated-3)
rated-4 (rated-4)
rated-5 (rated-5)

### WC Pages ###

Shop base: #5 - /shop/
Cart: #6 - /cart/
Checkout: #7 - /checkout/
My account: #8 - /my-account/
Terms and conditions: #25 - /about/terms/

### Theme ###

Name: ProPhoto 6
Version: 6
Author URL: https://www.prophoto.com/
Child Theme: ? – If you are modifying WooCommerce on a parent theme that you did not build personally we recommend using a child theme. See: How to create a child theme
WooCommerce Support: ?

### Templates ###

Archive Template: Your theme has a woocommerce.php file
you will not be able to override the woocommerce/archive-product.php custom template since woocommerce.php has priority over archive-product.php. This is intended to prevent display issues.

Overrides: –

    The page I need help with: [log in to see the link]

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

  • Hi @olga1706,

    After latest WooCommerce update shop thumbnail images (below the main product image/single product) look very blurry. I have regenerated thumbnails but it didn’t change anything. I can’t think what else I can do to fix it.

    Do you have an example of a page that has blurry images? I went to the link you provided but I didn’t notice any blurry images.

    Thread Starter olga1706

    (@olga1706)

    Hi Mikey,

    Thanks for getting back to me.
    Here’s a link for you https://www.olenkadesign.co.uk/shop/milana-hot-pink-grey/

    It’s the small images underneath the main product image that look blurry.

    Thanks.

    Olga

    Thanks!

    So the images are 100×100 but being displayed at 121×121 which might be why they look blurry:
    https://a.mikey.link/pQDqw0

    Try going to your Shop page, clicking on Customizer, and then going into the WooCommerce > Product Images panel. From there try setting a thumbnail size to be larger. If you don’t see the options there, it means your theme is setting them already – in which case I would suggest contacting your theme author to see if they can suggest a way to override their settings.

    Thread Starter olga1706

    (@olga1706)

    Thanks Mikey. I am using a third party theme, though if I activate any of the WooCommerce themes I still have the same issue. And there is no option for me to control the size anymore in WooCommerce themes. Also the problem appeared after installing the newest version of WooCommerce. So it doesn’t make sense to me.

    Hi @olga1706,

    Thanks Mikey. I am using a third party theme, though if I activate any of the WooCommerce themes I still have the same issue. And there is no option for me to control the size anymore in WooCommerce themes. Also the problem appeared after installing the newest version of WooCommerce. So it doesn’t make sense to me.

    The option moved in WooCommerce 3.3 to the customizer – If you go to your Shop page, go to the Customizer, click WooCommerce > Product Images and the option is still not there, it means that your theme is declaring image sizes already.

    Sometimes a theme will declare a gallery thumbnail, if it does, you would need to override it like this:

    add_filter( 'woocommerce_get_image_size_gallery_thumbnail', function( $size ) {
return array(
'width' => 150,
'height' => 150,
'crop' => 0,
);
} );

    IF the theme does not set a specific thumbnail size, you can go to Settings > Media and declare the size there:
    https://a.mikey.link/K6RoSd

    Thread Starter olga1706

    (@olga1706)

    Hi Mikey,

    Thank you for your help.
    I did both things you suggested and regenerated thumbnails but the images still look blurry.. Do you have any ideas what else maybe causing it?

    Thanks,
    Olga

    Hi @olga1706,

    It looks like the images are still 100×100 – check your Settings > Media section to see if the Thumbnail is bigger than 100 x 100:

    https://a.mikey.link/2VSNgE

    And then do another Regenerate.

    Cheers,

    Thread Starter olga1706

    (@olga1706)

    Hi Mikey,

    I have just checked my settings and thumbnails are 150×150. However when go to regenerate thumbnails I see that WooCommerce has own thumbnail sizes:
    Thumbnail Sizes

    These are all of the thumbnail sizes that are currently registered:

    thumbnail: 150×150 pixels (cropped to fit)
    medium: 300×300 pixels (proportionally resized to fit inside dimensions)
    medium_large: 768×0 pixels (proportionally resized to fit inside dimensions)
    large: 880×466 pixels (proportionally resized to fit inside dimensions)
    pp-tiny-thumb: 50×0 pixels (proportionally resized to fit inside dimensions)
    woocommerce_thumbnail: 400×400 pixels (cropped to fit)
    woocommerce_single: 600×0 pixels (proportionally resized to fit inside dimensions)
    woocommerce_gallery_thumbnail: 100×100 pixels (cropped to fit)
    shop_catalog: 400×400 pixels (cropped to fit)
    shop_single: 600×0 pixels (proportionally resized to fit inside dimensions)
    shop_thumbnail: 100×100 pixels (cropped to fit)

    There is no way for me to change those settings? I have just tried using the code you provided earlier but it made no difference.

    Can you assist further please.

    Thanks,

    Olga

    Hi @olga1706,

    If your theme is setting WooCommerce specific sizes, you can override them by following this document:

    https://docs.woocommerce.com/document/image-sizes-theme-developers/#section-3

    The Thumbnail size will either come from the theme that’s setting it, or use the default media one. If it’s not using the default media one it has to be set in the theme somewhere and you can do something like this to do it:

    add_filter( 'woocommerce_get_image_size_gallery_thumbnail', function( $size ) {
return array(
'width' => 150,
'height' => 150,
'crop' => 0,
);
} );

    If that doesn’t work, I would suggest contacting your theme author to see what could be going on.

    Thread Starter olga1706

    (@olga1706)

    Hi Mikey,

    The code has worked after we installed Custom functions plugin.
    So the images look normal now. Thanks for your help!

    Olga

    Hi @olga1706,

    Excellent! Glad that worked ??

    Hey Mikey,

    I’m a bit new to web development and I’m currently working on a Woocommerce website. My issue is in the shop module in Divi on the homepage. I uploaded the product images through Woocommerce when I set up the product page. Everything else looked good, but when I set up the shop module in Divi all of the images were slightly fuzzy. Please let me know what is going on here.

    Thank you,

    -Tyler

    The link is https://www.pacificpromises.com

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘Shop thumbnail images very blurry after update to 3.3.2’ is closed to new replies.