· Design My Website · Code Snippets · 1 min read
How to Disable Image Zoom on WooCommerce Product Pages
Disable image zoom on WooCommerce product pages with one filter in functions.php, or use the Code Snippets plugin if you would rather not edit theme files.
Steps:
- Access Your WordPress Dashboard:
- Go to Appearance > Theme File Editor.
- Alternatively, use an FTP client or a code editor if you prefer working locally.
- Edit the Functions File:
- Open your theme’s
functions.phpfile (preferably in a child theme to avoid losing changes during updates).
- Open your theme’s
- Add the Code:
_add_filter( 'woocommerce_single_product_zoom_enabled', '__return_false' );_ - Save Changes:
- Click Update File if editing through WordPress or upload the file if using FTP.
Why This Works:
- This code uses WooCommerce’s built-in filter
woocommerce_single_product_zoom_enabledto disable the zoom feature globally by returningfalse.
Important Notes:
- Use a Child Theme: If you’re editing the
functions.phpfile directly, consider using a child theme to avoid overwriting changes when updating the theme. - Test the Site: Clear your browser and website cache, then check a single product page to ensure the zoom feature is disabled.
If you don’t want to mess around with the functions.php file you can download a plugin called Code Snippets. You can download it here.
About the author
Tommy O'Shea
Tommy owns and runs Design My Website, a web design studio in Kilcummin, Co. Kerry. He has built and maintained over 100 websites for businesses across Kerry, Cork and Ireland over the last 13 years.
