How to Remove Product Image in WooCommerce? A Step-by-Step Guide

WooCommerce is a flexible eCommerce platform that allows you to customize almost every aspect of your online store.

However, store owners have one common question: “How do I remove product images in WooCommerce?” 

The easiest way to remove product images in WooCommerce is with the Free Hide Product Image for WooCommerce plugin. Just install the plugin. Activate it, and in the settings, check the box to hide all product images and save the changes. And, you can also remove images by specific product from this plugin without any coding.

This guide will provide 3 free yet effective ways to remove the product images from your Woocommerce store.

• Hide Product Image in WooCommerce with Plugins
• Remove the Product Image from the Product Page
• Remove Product Images Using CSS

Method 1: Hide Product Image in WooCommerce with Plugins

Plugins are the easiest and most user-friendly way to hide or remove product images in WooCommerce. Here are the top three plugins you can use:

Top Plugins to Remove Product Images in WooCommerce

Hide Product Image for WooCommerce

• Provides options to hide product images, shop images, and thumbnail images.
• Easy-to-use interface for beginners
• Remove images without coding skills

Delete product images for WooCommerce

• Lightweight and performance-friendly plugin
• Options to hide/delete images and products
• User-friendly settings for quick edits

Out of the two, Hide Product Image for WooCommerce is the best choice due to its simplicity and robust features. Here’s how to use it:

How to Hide All Product Images in Woocommerce?

Here is step-by-step guide to hide all product Images in Woocommerce.

Step 1: Install and activate the plugin.

• Go to your WordPress dashboard.
• Navigate to Plugins > Add New.
• Search for “Hide Product Image for WooCommerce.”
• Install and activate it.

Step 2: Go to WordPress Dashboard > Settings > Hide Product Image for Woocommerce.

Step 3: Hide All Product Images:

• Check the option to hide all product images under the General tab.
• Click on “Save Changes” to apply the updates.

Step 4: Visit your store to ensure the product images are hidden as desired.

All of your WooCommerce product images are hidden now. To make them again visible, just uncheck the option and save changes.

How to Hide Specific Product Image in WooCommerce?

If you want to hide particular product images, not all your product images, then you can do this using the same plugin with add-ons.

Step 1: Go to WordPress >> Settings >> Hide Product Image for Woocommerce.

Step 2: Hit on the Add-ons tab and select the Hide Images by Products add-on.

Step 3: Get the add-on and enter the specific product ID in the Hidden Product IDs section.

Step 4: Save the changes, and your particular product image will be hidden.

Method 2: Remove the Product Image from the Product Page

WooCommerce provides an easy way to remove product images from individual product pages through its default settings. You can quickly remove the product image without deleting it from your media library. 

Step 1: Navigate to your WordPress Dashboard > Products > All Products.

Step 2: Select the product you want to remove the image for and click Edit.

Step 3: In the Product Data section, locate the Product Image box on the right side and click the Remove product image link to delete it.

Step 4: Hit Update the product to save your changes.

Method 3: Remove Product Images Using CSS

If you don’t want to install any plugins for this and prefer a code-based approach, CSS is a simple way to remove product images on your WooCommerce site.

Step 1: Copy the following CSS code.

/* Hide Product Images on Shop Pages */

.woocommerce ul.products li.product .attachment-woocommerce_thumbnail {

    display: none;

}

/* Hide Product Images on Single Product Pages */

.woocommerce div.product div.images {

    display: none;

}

Step 2: Go to Appearance > Customize > Additional CSS and paste the code.

Step 3: Click “Publish” to apply the CSS rules, and all the product images are removed.

Additional Tips for Removing WooCommerce Product Images

1. Use conditional logic:

• Hide images only for specific categories or products using conditional tags in your code.

if ( is_product_category( 'your-category-slug' ) ) {

    // Your code here

}

2. Replace Images with Placeholders:

• If removing images entirely disrupts your design, consider replacing them with a generic placeholder.

3. Test across Devices:

• Ensure your changes look good on mobile, tablet, and desktop.

Final Thoughts

When you remove product images in WooCommerce, it can enhance your store’s user experience for specific scenarios, like selling digital goods or services. Whether you prefer CSS or plugins, WooCommerce offers plenty of flexibility to achieve your desired look.

By following the steps outlined in this guide, you can effectively remove or hide product images without confusing your customers. Always test your changes and back up your site before making major edits. 

FAQs