No Zoom on Woocomerce images

Support
#7

Ive updated X, and tried deactivatig a few plug-ins I recently updated but there are still no images…

#8

Hi There,

I could see that you’re using the WooCommerce version 3.5.3. Our X/Pro theme is not compatile with that version yet.

Could you please try downgrading it the version 3.5.1?

You can download the WooCommerce version 3.5.1 here: https://downloads.wordpress.org/plugin/woocommerce.3.5.1.zip

I could also see that all the source files have the x75717 at the end. Please try turning off as well:

https://www.honestlynatural.com.au/wp-content/themes/x/framework/dist/css/site/stacks/renew.x75717.css

Let us know how it goes!

#9

ok thanks, ive changed to the old woocommerce, Im not sure how I turn off the source files with the x75717

#10

Hi There,

Please try temporarily turn off all the 3rd party plugins, CDN, Optimize, … services then check again.

If it still doesn’t help, please add this custom CSS under Thene Options > CSS:

.woocommerce-product-gallery__image img {
    width: 100%;
    height: 100%;
}

Hope it helps :slight_smile:

#11

Thank you, that code has brought the images back, you are such life savers.
One little problem is there is now no zoom on the images though.

Also how do we know when X is compatable with the new woocomerce so I can update?

#12

Hey Nonie,

The code given here is only a band aid fix. You don’t need code unless it’s proven to be a bug. In this case, we’ve not yet proven if the issue you’re facing is a bug because you are optimizing your site.

I’m not saying that website optimization is bad. In fact, it’s recommended. The only thing that is wrong is if you enable it even in times of maintenance such as during website updates and using its options not knowing what it will do with the resources within WordPress.

Please turn disable all options in W3 Total Cache and purge all caches then check if the issue persists. The most common causes are file minification, concatenation and inlining code such as what Thai referred to x75717.

Please always do this step before posting an issue. If the issue persists, please deactivate your caching plugin and give us WordPress Admin credentials in a secure note.

Regarding compatibility of WooCommerce, if there’s an update, you can check if it’s compatible in our Version Compatibility list at https://theme.co/apex/forum/t/troubleshooting-version-compatibility/195

Thanks.

#13

I have just updated my x and cornerstone and even with the code you gave me the images are still having some issues from what I can see on my end. Zoom is working sporadically and When you click the image or the magnifying glass it goes to a black screen.

#14

Hey Nonie,

Updating to the latest version is good to ensure compatibility but if you review my previous response, I also said:

Please review my full response and please do the requested steps before we continue.

Thanks.

#15

Hi Christian, I have disabled all options in w3 and purged all cashes, I don’t really know what file minification, concatenation and inlining code means so I am unable to do anything in that aspect. Perhaps you could direct me on what you mean with all that and how to fix it?

#16

They’re features of W3 Total Cache. Please refer to the W3 Total Cache documentation to learn how to disable them.

Please post your login credentials in a secure note also.

Thanks.

#17

Will do, thanks, I have added a secure not above

#18

Hi There,

Your website is returning the 503 error code:

Could you please double check?

Thank you.

#19

Oh no, that’s only happened since I played with the cache settings… I just reset w3 to default and it seems to have fixed that error

#20

The issue was because your images are generated as 1 x 1px only. This could be because of your image optimizer plugin.

Now, I installed the Force Regenerate Thumbnail plugin and regenerated the images in this page https://www.honestlynatural.com.au/shop/ansc-true-love-for-him-gift-pack/ and it’s fixed both the “not displaying” image and zoom issue in your site.

I’ve also commented out the code provided previously as that was not a real solution.

You will need to regenerate all of the images of your shop. Please refer to the plugin’s page for usage instructions.

Hope that helps.

#21

Wow thank you so much christian, I will do this to all my product images today.
Should I delete the image optimizer plugin? Is that fairly pointless as it is clashing so no need for it??

And is there something I should know about when uploading new images for my shop page? Or will I always need to use the regenerate plugin?

#22

Hello Nonie,

If you are using caching plugin, please deactivate the image optimizer plugin. In most cases, the optimized images were not properly cache thus created a series of issues of your site. Regenerate thumbnails plugins is needed when there is a change in image dimension settings. once everything is set, uploading a new image should be fine and with no issues.

Hope this helps.

#23

Thank you, I have regenerated all the images and now everything is perfect in that area :slight_smile:

I do however have another issue which was fixed but now somehow reverted… See image attached, the area is not going full width, I have it set to the same settings as all the other areas. I seem to keep having issues with areas not going full width…

#24

Hello Nonie,

Thanks for updating in!

Your section not fullwidth issue could be because the section itself is being set to display that way. Please edit the page back in Cornerstone and make sure that the “Inner Container” is disabled in the row settings. Do not also forget the Width and Maximum Width settings.

Hope this helps.

#25

I have changed it to the setting you said but the container background is still not full width

#26

Hello Nonie,

I have inspected your page again and it appears that in your section settings, you have set a maximum width of 825px. Please edit the page back in Cornerstone and change the maximum width to 100% instead.

Please let us know how it goes.