How to Disable WooCommerce Image Zoom Effect

by | Jun 18, 2021 | Code Snippets | 2 comments

By default, WooCommerce has a zoom effect on the main product page when you hover over it. This only works on single product pages. If you don’t like this zoom effect, follow the steps below to learn how to disable it.

There are two ways to add custom PHP code to your WordPress websites; via a child theme or the free Code Snippets plugin.

I always recommend this plugin because it is safer, and you can enable/disable snippets individually from your WordPress admin dashboard without the need for modifying code or worrying about breaking anything.

You can download the plugin from here.

Install it like any other WordPress plugin.

But you can always use the child theme’s functions.php file if you want.

The Code Snippet

/**
 * Disable WooCommerce zoom effect on the product image
 * @author Abdelfatah Aboelghit
 * @version 1.0
 */
add_action( 'wp', 'divikingdom_disable_wc_zoom', 99 );

function divikingdom_disable_wc_zoom() {
	remove_theme_support( 'wc-product-gallery-zoom' );
}

Choose one of the two methods to disable WooCommerce image zoom effect.

Add the code snippet via the plugin

How to Disable WooCommerce Image Zoom Effect 1

If you go with the Code snippets plugin:

1. Go to Snippets -> Add New. Give the snippet a title; let’s say: Disable WooCommerce zoom effect.

2. Copy the code above and paste it into the Code area.

3. Check the “Only run on site front-end” option.

4. Click Save Changes and Activate.

Add the code via a child theme

How to Disable WooCommerce Image Zoom Effect 2

If you prefer to use the child theme method, that’s fine. Any child theme has a functions.php file in its root directory.

1. The code should be added at the very end of the functions.php file.

2. If the file ends with the ?> symbol, remove it and then add the code.

Let me know if the code works for you!

By Abdou

My name is Abdelfatah Aboelghit, a PHP developer from Egypt and my friends call me Abdou!
Here I write and develop products about Divi Theme.

More Article

2 Comments

  1. Lynn

    That worked brilliantly, thank you! So much easier to follow than other tips on the same subject.

    Reply
    • Abdou

      Glad to know that 🙂

      Reply

Submit a Comment

Your email address will not be published. Required fields are marked *

Shop Tabs Plugin

A must-have plugin for Divi & WooCommerce.

Read More

Divi Theme

The Best Theme For WordPress. 

Read More

Pin It on Pinterest

Share This