Hide Magnifier icon on Woocommerce single product page image gallery

Many WordPress site using Woocommerce plugin to create their e-commerce site and manage the products to sell it online.

On Woocommerce single product page, you can either display one image of the product or a gallery of it. At the top of the image, right corner magnifier icon is displayed and you may like to hide it.

How to hide it?

The magnifier icon displayed on the top of the woocommerce product image, can be easily hide by using simple custom css.

Just copy the below css and paste it on your theme css file or to Jetpack custom css or to your theme custom css option.

If you want to add it in your theme stylesheet, then go to Appearance -> Editor Now select style.css from the right side template list. After selecting stylesheet copy the above css and paste it then update the file. check the screenshot below.

That’s it. Now clear the cache if you are using any, then refresh the woocommerce product page. It should work.

You can check it live on my e-commerce site -> Click Here

Post Comment