Thumbnail Images not always scaling properly

[MedHemporium]

I’ve been having a bug where the additional images on my products don’t always scale properly. It appears to be random as to which images/products it does it on. Below is part of a chat I had with woocommerce support, and they referred me here.

"

Oh ok, definitely looks like a theme bug. I would recommend checking with the theme author so that they can release a patch to resolve this.

really? it only does it with the images on the additional images variations for our products, it doesn’t do it anywhere else on the site.

Oh yes, the theme is unable to render the changing image as per the dimensions specified causing it to load the raw image. They have to rewrite some css to fix this. You can give them this screenshot and they will understand. Another situation this can happen: the css file that does the styling fails to load so the image loads and does not know how to style itself. this can happen due to some data corruption while loading via the internet.

ok so I should contact my theme support channel?

That is correct, you can tell them that they need to roll out a patch. Give them the screenshot too.
"

[ruenel]

Hello Steven,

Thanks for writing in! I have checked the page and I am seeing this:

I could not replicate the issue on my end. And I also found out that you are using Cloudflare. Right after your updates, please log in to your Cloudflare account and purge your site cache. You also need to regenerate the minified CSS and JS files in CloudFlare.

• https://support.cloudflare.com/hc/en-us/articles/200169246-Purging-cached-resources-from-Cloudflare
• https://support.cloudflare.com/hc/en-us/articles/200169396-Why-aren-t-changes-to-my-site-showing-
• https://support.cloudflare.com/hc/en-us/articles/200168196-How-do-I-minify-HTML-CSS-and-JavaScript-to-optimize-my-site-

If nothing is helping, provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
​
To know how to create a secure note, please check this out: How The Forum Works

Best Regards.

[MedHemporium]

Hi Rue,

The issue happens randomly, so just because it’s happening to me on a given picture doesn’t mean it will for you, or even that I’ll have an issue with that specific image even an hour later maybe. It’s been happening since we built the site on wordpress in april. It happens not just for me but for other people I’ve talked to as well.

I think this means it’s not an issue with purging the site cache?
This quote is what the original person I talked to about this said if that helps.

@MedHemporium

Oh yes, the theme is unable to render the changing image as per the dimensions specified causing it to load the raw image. They have to rewrite some css to fix this. You can give them this screenshot and they will understand. Another situation this can happen: the css file that does the styling fails to load so the image loads and does not know how to style itself. this can happen due to some data corruption while loading via the internet.

I’d be happy to have someone come in to try to fix it, as I don’t know very much about this.

[nabeel]

Hey Steven,

I believe this is happening because of the zoom feature, try disabling this feature by adding the following code in your child theme’s functions.php file and see if this resolves the issue:

function remove_image_zoom_support() {
    remove_theme_support( 'wc-product-gallery-zoom' );
}
add_action( 'wp', 'remove_image_zoom_support', 100 );

Let us know how this goes!

[christian]

Hey Steven,

I would just like to chime in here that the broken page, the one in your screenshot, is working fine on my end too just like my colleague, Ruenel. I then checked the rest of the product pages on your site but I didn’t experience the issue like in your screenshot.

That said, this is not a theme issue because if it is, we’ll be getting the same exact issue as you’re seeing, and not only that, all users will be experiencing this issue in their sites including us.

It could be that the CSS or JS that is responsible for loading the image fails to load not because of our theme but because of something in your site like a 3rd party plugin, website optimizations, etc…

We’re still open to see if our theme is really the cause of the issue but first do the following troubleshooting steps because it would be unfair to blame the theme if a 3rd party factor is the one causing the issue.

1. Testing For Theme Related Issue
2. Testing For Plugin Conflict
3. Child Theme
4. Disabling Cache
5. Disabling Cdn

Only if none of the troubleshooting steps help, please give us the information asked by Ruenel. If one of the steps resolves the issue, that is the area you should investigate so for example if it’s a 3rd party plugin that is causing the issue, you should contact the plugin author.

Please also clear your browser’s cache and try other browsers and temporarily disable all browser extensions.

Thank you.