If you would like to disable the “zoom” product image hover effect in WooCommerce, you may have come across various postings about adding some php code to your functions.php file, but that does not always work.
Instead, here’s an even easier and in my humble opinion, more effective way to disable the “zoom” product image hover effect in WooCommerce:
First, in WP Admin, Go to “Appearance” –> “Customize” –> “Additional CSS” and now add the following code:
/* *** Disable Woo Product Zoom *** */
.zoomWindowContainer {
display:none!important;
}
/* *** Disable Woo Product Zoom *** */
Remember to click the “Publish” button
Now go back to the individual product page of WooCommerce, refresh your browser and Voila!