Step-by-step guide: Removing the add to cart button in WooCommerce for catalog use

Do you want to remove the add to cart button in WooCommerce? Here, I'll walk you through 3 methods to disable the default add to cart feature in your WooCommerce store: using WooCommerce's built-in options, with the help of a product catalog plugin, as well as basic and advanced code snippets.

In this in-depth tutorial, I'll guide you through three different methods to remove the add to cart button in WooCommerce:

• Method 1: Using the simple-to-use WooCommerce Product Table plugin to showcase products and product data in a catalog-style layout without add to cart buttons.
  • Bonus: I'll also show you how to combine it with WooCommerce Wholesale Pro to hide product prices from logged-out users.
• Method 2: Using advanced custom code snippets to hide the add to cart button for all products in youe store.
• Method 3: Using a workaround that involves WooCommerce's built-in inventory management settings together with some custom code to hide the add to cart button for specific products and categories.

Ready? First things first, let's unpack the most common reasons for disabling the add to cart button in WooCommerce.

Why remove the Add to Cart button in WooCommerce?

On the surface, removing the add to cart button from WooCommerce might seem counterintuitive. Many Woo store owners, however, opt to remove it in order to align their site's design with their overall business strategy, simplify their store's interface to preserve customers' shopping experience, and boost sales overall. For example:

• Stores in catalog mode. While it may be more common to use WooCommerce to create a store that can process payments and complete the entire purchase process, many store owners build WooCommerce websites with the intent of showcasing their product catalog without accepting direct orders. Removing the add to cart button shifts the store to a catalog-only mode that displays their products.
• Products available for pre-order. For products not yet available for immediate purchase — such as upcoming book releases or limited-edition merchandise — removing the add to cart button can help build anticipation for their launch. This sets the right expectations with shoppers and enables you to capture leads before their official release dates.
• Managing limited stock or out-of-stock products. No one likes adding a product to their cart only to find out that it isn't in stock. If a product is only available in limited quantity or is out of stock, removing the add to cart button can help prevent customers from attempting to buy products that aren't available (which can frustrate them and lead to more abandoned carts).
• Restricting purchases to certain users. It's pretty common for stores that cater to specific customer groups — think: wholesalers, members, or trade-only buyers — to restrict access to the add to cart button. Removing the button for non-logged-in users or customers without a wholesale account creates a gated shopping experience where all customers can view your store's product list. However, customers must fulfill the set criteria to register, request approval, and successfully place orders.
• Stores that sell enquiry-based products. High-ticket, custom-made, or complex and configurable products — think: machinery, industrial equipment, bespoke furniture, etc. — often require detailed discussions and tailored product amendments before purchases are completed. In these situations, showcasing products without the add to cart button encourages customers to contact you for more information or to request a quote.

Method 1: Using a plugin to remove the add to cart button in WooCommerce

WooCommerce Product Table is a robust plugin that lets you showcase products in an organized, interactive, and user-friendly catalog-style layout. Depending on your preference, you can display products in the table with and without add to cart buttons.

It's particularly popular amongst stores with large product catalogs, standalone and hybrid wholesale shops, as well as various kinds of stores that need an efficient way to present items together with relevant product data.

WooCommerce Product Table is super simple to use and customize and there are tons of template designs to choose from. Once you've created a custom table, you can make use of blocks and shortcodes to easily display the product catalog anywhere on your website: your homepage, shop page, landing pages, dedicated catalog pages of your website, etc.

WooCommerce Product Table's standout features

• Fully customizable table layouts. It allows you to choose which columns to include in the product catalog, such as product name, image, price, stock status, SKU, description, and custom fields or custom taxonomies. Customers can view all product details at a glance without needing to open individual product detail pages. This makes it easy to decide which product information to showcase and to present it in a way that suits your business.
• Replace the add to cart button with custom options. In catalog mode, you can remove the add to cart button and only showcase product prices along with additional details like product images, a link to a contact form, product prices, or something else entirely.
• Powerful filters and search options. The plugin includes advanced search and sorting options along with filters that can be based on product categories, tags, attributes, keywords, or even custom taxonomies. These options make it easy for shoppers to narrow down their options to find the exact products they need, even if your product catalog lists hundreds or thousands of items.
• Mobile-friendly and quick-loading. The product tables are fully responsive. This means your catalog will look great on various screen sizes — desktops, smartphones, laptops, tablets, etc. Plus, the plugin is optimized for performance, so even websites with hundreds or thousands of products load quickly.

A few quick notes:

• The WooCommerce Product Table plugin can be used for several additional use cases along with product catalogs. Think: quick order forms; product directories; restaurant food ordering systems, etc.
• If needed (at a later time, for example), you can enable quantity pickers and add to cart buttons. These allow customers to specify quantities for each item and add them to their carts. Then they can initiate checkout directly from the product catalog without navigating product detail pages.
• WooCommerce Product Table works well on its own and when paired with other plugins like WooCommerce Wholesale Pro (to add other vital features for wholesalers), WooCommerce Quick View Pro (to showcase product images, descriptions, and technical specifications in a lightbox when customers click on a product name or image within the table), and more.

A step-by-step guide to creating a catalog-style table

The process of setting up WooCommerce Product Table and using it to create a catalog that lists products without add to cart buttons is pretty straightforward. Follow these detailed setup steps.

1. Create a custom catalog using the product table builder

1. Download and activate the WooCommerce Product Table plugin.
2. In your site's admin panel, navigate to Products → Product Tables → Add New to open the table builder.
3. The first step is to name this product catalog. (You can create multiple catalogs, each named differently. Use a unique name here so it's easy to differentiate between them).

   

4. Decide how you wish to showcase the product catalog on your store. You can either use a block or shortcode to add it to a page or use it to replace the default Shop page.
5. Next, pick which products to display in the catalog: all products or select ones.
   

   

6. Decide the product information you want to showcase in the catalog. Feel free to add and remove columns to tailor the product table catalog per your needs. You can also customize column titles as you prefer. Note: Refer to this knowledge base guide about which columns you can add and what they mean.

   

   • Remove the "Buy" column as you don't want customers to add items to their shopping carts directly from the product catalog. This will remove the Add to Cart buttons from the product table.
   • To prevent shoppers from being able to navigate to single product pages (which contain "Add to Cart" buttons), click on the pencil icon for each column. Then disable the link to the product detail page.

2. Remove the add to cart buttons in WooCommerce

1. Ignore the "Add to cart method" and "Quantities" settings as you've removed the add to cart button.
   

   

2. Decide how you want variations to be shown: as dropdown lists, one per row, or with the "Read More button linking to the product page" (if applicable).
3. On the "Performance" screen, decide whether to enable lazyload to load products one at a time. You can also set the maximum number of products that can be shown in the catalog.
   

   

4. On the "Search & Sort" screen, you can enable and add filters that will be shown above your product catalog. These options are particularly useful if you plan to showcase a large number of products on a single page.
   

   

5. You can also choose the initial sorting criteria as well as the direction in which products are sorted.

   

6. Repeat the steps to create as many product catalogs as needed.

3. Publish the product catalog without add to cart buttons

Note: Skip these steps if you opted to add the product catalog to the default Shop page in the previous section of this tutorial.

To add the product catalog without add to cart buttons to a page or post on your website:

1. In your WooCommerce site's admin panel, create a new page or edit an existing one.
2. If you're using WordPress's classic editor, get the shortcode from Products → Product Tables and paste it onto the page.
3. If you're using the Block editor, insert the Product Table block where needed on the page.
   
4. Once you've added the product table, publish or update the page. You can then view the page on your site's front end to check out the catalog showcasing all your products.

Bonus: Hide prices from logged-out customers

As discussed in the previous section, WooCommerce Product Table enables you to showcase products in a user-friendly one-page catalog. In contrast, WooCommerce Wholesale Pro's "Hide Price Until Login" feature enables you to hide product prices from logged-out shoppers.

Paired together, WooCommerce Product Table and WooCommerce Wholesale Pro help create a seamless, conversion-focused wholesale ordering system in your store. The result? A catalog-only store that everyone can access, while only logged-in wholesale customers can view product prices and place orders.

This 2-plugin bundle setup works because it saves time for buyers and creates a smooth, tailored experience that encourages them to purchase in larger quantities. At the same time, it also streamlines the ordering process and enables you to control access to product prices and wholesale-only sections of your online store.

The price field will be blank in the product catalog table, like this:

When customers click through to the product detail pages, they will see the notification to log in to view prices, like this:

A quick note: WooCommerce Wholesale Pro is the best wholesale plugin designed to help Woo store owners cater to both retail and wholesale customers from the same online storefront. Along with enabling you to hide prices from logged out users, it gives you more control over wholesale pricing, allows you to restrict access to wholesale products, and creates a seamless dual-store experience.

Here's a quick overview of its additional features

• Custom login and registration forms. It lets you customize the signup form and login page for wholesale buyers so you can collect information that's relevant to your business. Buyers can submit applications to access the wholesale sections of your WooCommerce store and you can manually approve their accounts.
• Wholesale pricing for specific user roles. You can set wholesale prices for individual products or categories and offer discounted rates exclusively to wholesale customers. Retail customers will see standard product prices, while wholesale users see their discounted rates after logging in.
• Custom user roles. It integrates well with WooCommerce’s built-in user role system and allows you to create custom wholesale roles — think: wholesale buyer, distributor, VIP customers, etc. — each with different pricing structures or discounts.
• Hidden products or categories. You can designate certain products, categories, or pricing as "wholesale-only" and hide them from retail customers.

A step-by-step guide to hiding prices from logged-out users on your product catalog

Here, I'll walk you through the steps to use WooCommerce Wholesale Pro with WooCommerce Product Table to hide product prices from non-logged-in users on your product catalog.

Setup tutorial

1. Get the WooCommerce Wholesale Pro plugin and install it on your WooCommerce store.
2. From within your site's admin area, go to WooCommerce → Settings → Wholesale → General.
3. In the "Wholesale price display" section, decide how you want prices to be shown to logged-in customers on product detail pages. You can either show the wholesale price alongside the retail price (with the retail price crossed out) or show only wholesale prices.
   

   

4. Important: Check the "Hide prices until login" option if you wish to create a semi-public wholesale store. With this setup, customers will be able to view your product catalog but they'll be required to register and gain approval to access pricing.
5. In the "Alternate Content" section, you can add a custom message that will appear to logged-out customers in place of the product price on product detail pages. You can use this space, for example, to let customers know that they must register and be approved as wholesale users to access your store's pricing.
6. Next, configure the remaining settings regarding the wholesale registration and login pages, tax calculations, coupons, and more.
   Finally, click Save Changes at the bottom of the screen to apply your settings.

Method 2: Using code to remove the add to cart button in WooCommerce

In this section, I'll share code snippets that can help you hide the Add to Cart button in WooCommerce. This method allows for more advanced and specific functionality, such as hiding buttons based on complex conditions or integrating with existing systems.

A quick note: This entire section is aimed at experienced developers who are already familiar with how WooCommerce hooks and filters work. If you're not an expert developer, I recommend you use a plugin instead to avoid:

Pre-requisites:

Before adding custom code snippets to your website, remember to:

One way to remove Add to Cart buttons for all products using custom code is by utilizing the woocommerce_is_purchasable filter. Use the below snippet:

// Making all products unpurchasable by returning false when WooCommerce checks if a product can be purchased.
add_filter( 'woocommerce_is_purchasable', '__return_false' );

// Hiding product prices throughout the site
add_filter( 'woocommerce_get_price_html', '__return_empty_string' );
add_filter( 'woocommerce_cart_item_price', '__return_empty_string' );
add_filter( 'woocommerce_cart_item_subtotal', '__return_empty_string' );
add_filter( 'woocommerce_cart_subtotal', '__return_empty_string' );
add_filter( 'woocommerce_cart_total', '__return_empty_string' );

// Prevent adding products to cart via direct URLs
add_filter( 'woocommerce_add_to_cart_validation', '__return_false' );

// Removing "Add to Cart" buttons from product loops (shop and archive pages)
remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10 );

// Removing "Add to Cart" button from single product pages
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );

Method 3: Using built-in settings and code snippets to remove the add to cart button in WooCommerce

This method combines both WooCommerce's default settings and custom code snippets to hide the add to cart button.

Technically, there is no direct option to hide the add to cart button in WooCommerce's settings. As a workaround, however, you can customize the default inventory options to achieve this by assigning products as out of stock. This will hide the add to cart button since WooCommerce automatically disables purchasing for out-of-stock items.

Once that's done, you can then add custom code snippets to keep your stock management accurate.

How to remove Add to Cart buttons for individual products using WooCommerce's default settings

1. From your WooCommerce site's admin, go to Products → All Products.
2. Open the Edit page of the product for which you want to hide the add to cart button.
3. Scroll to the Product Data section and access the Inventory tab.
4. In the Stock Status section, select "Out of Stock". This will hide the "Add to Cart" button and show an "Out of Stock" message instead.

The below code snippets will help ensure your store's inventory calculation is correct.

// Define your product IDs in an array
$disabled_products = array( 123, 231, 312 );

// Disable Purchasability
add_filter( 'woocommerce_is_purchasable', 'disable_purchasable_specific_products', 10, 2 );
add_filter( 'woocommerce_variation_is_purchasable', 'disable_purchasable_specific_products', 10, 2 );

function disable_purchasable_specific_products( $purchasable, $product ) {
    global $disabled_products;
    $product_id = $product->get_id();
    $parent_id = $product->get_parent_id();

    if ( in_array( $product_id, $disabled_products ) || in_array( $parent_id, $disabled_products ) ) {
        $purchasable = false;
    }
    return $purchasable;
}

// Remove "Add to Cart" Button from Shop and Archive Pages
add_action( 'woocommerce_after_shop_loop_item', 'remove_add_to_cart_button_from_loop', 1 );

function remove_add_to_cart_button_from_loop() {
    global $product, $disabled_products;
    $product_id = $product->get_id();
    $parent_id = $product->get_parent_id();

    if ( in_array( $product_id, $disabled_products ) || in_array( $parent_id, $disabled_products ) ) {
        remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10 );
    }
}

// Remove "Add to Cart" Button from Single Product Pages
add_action( 'woocommerce_single_product_summary', 'remove_add_to_cart_button_from_single_product', 1 );

function remove_add_to_cart_button_from_single_product() {
    global $product, $disabled_products;
    $product_id = $product->get_id();
    $parent_id = $product->get_parent_id();

    if ( in_array( $product_id, $disabled_products ) || in_array( $parent_id, $disabled_products ) ) {
        remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );
    }
}

// Prevent Adding Products to Cart via Direct URL
add_filter( 'woocommerce_add_to_cart_validation', 'prevent_add_to_cart_for_specific_products', 10, 3 );

function prevent_add_to_cart_for_specific_products( $passed, $product_id, $quantity ) {
    global $disabled_products;

    // Get parent ID if it's a variation
    $parent_id = wp_get_post_parent_id( $product_id );

    if ( in_array( $product_id, $disabled_products ) || in_array( $parent_id, $disabled_products ) ) {
        $passed = false;
        wc_add_notice( 'This product cannot be purchased.', 'error' );
    }
    return $passed;
}

// Hide Price Everywhere for Specific Products
add_filter( 'woocommerce_get_price_html', 'hide_price_for_specific_products', 10, 2 );

function hide_price_for_specific_products( $price, $product ) {
    global $disabled_products;
    $product_id = $product->get_id();
    $parent_id = $product->get_parent_id();

    if ( in_array( $product_id, $disabled_products ) || in_array( $parent_id, $disabled_products ) ) {
        $price = ''; // Remove the price display
    }
    return $price;
}

Note: Replace 123, 231, and 312 with the IDs of the products for which you want to hide the Add to Cart button. Add as many product IDs as you want to that array.

Using a simple code snippet for entire categories

The steps are the same as the above. But we'll change:

• • $disabled_products = array( 123, 231, 312 ); to $disabled_categories = array( 'category-slug-1', 'category-slug-2');
  • Replace 'category-slug-1' and 'category-slug-2' with the slugs of the product categories for which you want to hide the Add to Cart button. Add as many categories as you want to that array.
  • in_array( $product_id, $disabled_products ) to has_term( $disabled_categories, 'product_cat', $product->get_id() )

SEO implications of removing the WooCommerce add to cart buttons

Ecommerce pages typically include add to cart buttons and signal transactional intent i.e. they cater to users ready to place an order. In contrast, catalog pages lean more toward informational or navigational intent, and provide product details without offering direct purchasing options.

When you remove the "Add to Cart" button from your WooCommerce site, it can cause search engines to start interpreting your site's content differently which can impact your organic traffic.

Here are some ways removing the "Add to Cart" button can impact your site's SEO rankings:

• Product page indexing. Removing the "Add to Cart" button doesn't stop search engines like Google from indexing your product pages — unless you explicitly block them. At the same time, Google is known to prioritize pages that deliver a complete and satisfying user experience. If, however, your site's pages lack expected ecommerce features or don't provide complete information (for example, no price or unclear purchasing options), they may perform poorly in organic search.
• Bounce rates and page dwell time. Removing the "Add to Cart" button might frustrate shoppers who expect to directly complete their purchases on your WooCommerce site (especially if this was previously possible). In addition, user engagement signals like high bounce rates and low dwell times can signal to search engines that your website's pages don’t meet visitors' expectations, which can tank your search rankings.
• Product-rich snippets in search results. Rich snippets — product prices, ratings, availability, etc. — help product detail pages stand out in search results. Removing the add to cart button doesn’t necessarily stop your site from using product-rich snippets, but it can change what information appears. Also, if a large portion of your target customers rely on visible price comparisons, it can impact the click-through rate (CTR).

Potential drawbacks of removing the WooCommerce add to cart buttons

With the 'Add to Cart' button gone, direct contact is now crucial for your users’ decision-making. To ensure you don’t miss out on dedicated purchases, make it as easy as possible for visitors to get in touch with you. Remember, any extra steps in the communication process could give them a reason to say 'no' to finalizing their purchase.

Nicholas ArceMagnified Web

The add to cart button is a call to action that nudges shoppers to place their orders. Before you remove the add to cart buttons from your WooCommerce store, here are some possible downsides to keep in mind.

• Confusion for customers expecting to make immediate purchases. Generally, when customers visit ecommerce sites, they expect to be able to place orders immediately. Removing the add to cart button without sufficient context, additional information or alternative next steps can lead to confusion amongst customers who expect to make quick purchases.
• Missed opportunities for impulse buys. Ecommerce shoppers are known to make quick, unplanned purchases, also known as impulse buys. Removing the "Add to Cart" button means customers who might have purchased a product on the spot are forced into a slower decision-making process. While some customers may follow through with contacting you or requesting a quote, others won’t — especially if they were just browsing or casually interested. This can reduce your store's conversion rate and revenue.
• Challenges in tracking product popularity. By default, WooCommerce captures a lot of data about your store. This includes metrics like add-to-cart rates (how often a product is added to the cart) and cart abandonment rates. Without the add to cart button, tracking which products are performing well and which aren't through WooCommerce's standard analytics will no longer be available.

WooCommerce Product Table solves many of these limitations by enabling you to showcase products in a sleek, catalog-style layout without the add to cart button and gives customers a pleasant shopping experience. Plus, you can display prices together with relevant product data which helps boost your site's organic search rankings.

Remove the add to cart button in WooCommerce today!

There are various methods to remove the add to cart button from your WooCommerce store: with the help of a plugin, with advanced custom code, and with a combination of WooCommerce's built-in settings and some code snippets.

WooCommerce Product Table is the best plugin to remove the add to cart button in WooCommerce. With it, you can use it to display products along with relevant product data in a catalog-style layout without add to cart buttons.

Use it on its own or paired with WooCommerce Wholesale Pro to hide product prices from logged-out shoppers.

Otherwise, if you have the expertise and are comfortable maintaining code, feel free to use the code snippets shared above to remove the add to cart button in WooCommerce.