How to Remove Add to Cart Button WooCommerce-WooCommerce QuickFix

WooCommerce is known as one of the most popular eCommerce solutions for WordPress. But most of the time, site owners don’t know how to remove add to cart button WooCommerce. For this reason, they cannot provide the product to their client which is out of stock or they don’t want to show. 

There are millions of articles available in the internet with the title “how to remove add to cart button in WooCommerce” but none of them are fully worthy of applying. Therefore I have decided to share the best possible ways of how to remove add to cart button in WooCommerce and additionally how to customize Add to cart option. 

Hope after reading this post you will be able to disable add to cart button WooCommerce for your site on your own. 

Process to Remove Add to Cart Button WooCommerce

There are several ways to remove add to cart button WooCommerce from your site. You can do it using two lines of code, via plugin or by using the Elementor page builder. Let’s do it and hide add to cart button WooCommerce. 

Using code

This is the most simplest procedure to disable add to cart button WooCommerce from your site. 

  • Open file manager from your cPanel and navigate to /public_html/**site_name**/wp-content/themes/**theme_name**
How to Remove Add to Cart Button WooCommerce-WooCommerce QuickFix 1
  • Now add the following code to the function.php file. 
remove_action('WooCommerce_after_shop_loop_item', 'WooCommerce_template_loop_add_to_cart');
remove_action('WooCommerce_single_product_summary', 'WooCommerce_template_single_add_to_cart', 20);
  • The snippet above will remove add to cart button WooCommerce from your site in shop pages as well as product pages. 

Wait… Is it the solution you have been looking for? 

By using a code snippet to hide add to cart button WooCommerce is the most common method, but it might not be the optimal solution. It will completely remove the button forever, and to roll back to the default state you need to remove code every time. 

This can be a serious pain to ass. Instead of adding code you can try plugins to customize or disable add to cart button WooCommerce on specific items. 

Using Plugins

There are several plugins available in the plugins directory to set options like “WooCommerce disable cart and checkout”, “WooCommerce remove add to cart button”, etc. Amon those plugins, “ELEX WooCommerce Catalog Mode, Wholesale & Role Based Pricing” plugin and “Remove Add to Cart WooCommerce” plugin is very much popular. 

I am providing a guide to use these plugins.

ELEX WooCommerce Catalog Mode, Wholesale & Role Based Pricing Plugin

Elex plugin allows you to customize add to cart button in three different ways. 

1. Remove Add to Cart Button WooCommerce Based on User Roles: With this method, you can remove add to cart button WooCommerce for specific user groups. Let’s assume you want to hide add to cart button WooCommerce for “Subscriber” and “Editor” user groups. 

How to Remove Add to Cart Button WooCommerce-WooCommerce QuickFix 2
  • Go to the Plugin settings. 
  • Navigate to the Role-Based Pricing tab. 
How to Remove Add to Cart Button WooCommerce-WooCommerce QuickFix 3
  • The very first setting you will notice is Remove add to cart button Woocommerce. Select user groups for which you want to remove or hide add to cart button WooCommerce. In my case, Subscriber and editor. 
  • Additionally, you can add placeholder text.
  • Now the specified user groups will not see the add to cart button. 
How to Remove Add to Cart Button WooCommerce-WooCommerce QuickFix 4

2. Disable Add to Cart Button WooCommerce Based on Specific Products: Have you ever faced the situation where you need to show products but don’t want to accept orders for them? The product for which you don’t want to accept order may have an issue or out of the stock. In such cases you can disable add to cart button for specific products. 

To do it 

  • Go to the Plugin settings.
  • Scroll down to the product data metabox and select “Role Based Pricing”. 
  • This plugin offers you two options – for unregistered users and based on user role. 
  • Now I am removing Add to cart button for both unregistered users and Editors. 
How to Remove Add to Cart Button WooCommerce-WooCommerce QuickFix 5
  • Now whenever a unregistered user or editor enters the demo store, the page will be shown as below. 
How to Remove Add to Cart Button WooCommerce-WooCommerce QuickFix 6

3. Replace Add to Cart Button: Posit you want to sell specific product from an external website. What you will do? 

The Elex plugin will allow you to replace the add to cart button text and allow you to set external link for the product.

To do this 

  • Navigate to Plugin settings > Role Based Pricing tab. 
  • Scroll down and select “Replace Add to cart” settings.
  • Select the user group for which you want to configure this setup. 
  • In the “Replace Button Text (Product Page)” field place your text. I have entered “Buy Now!”.  
  • In the “Replace Button Text (Shop Page)” enter the external URL that you want to place. 
How to Remove Add to Cart Button WooCommerce-WooCommerce QuickFix 7
  • Moving the shop page and updating the text will display as below. 
How to Remove Add to Cart Button WooCommerce-WooCommerce QuickFix 8
  • When a product from your site is viewed the updated text for Add to Cart button will show as below. 
How to Remove Add to Cart Button WooCommerce-WooCommerce QuickFix 9

If you have misjudged something, then check out the video below.

Remove Add to Cart WooCommerce Plugin

Using this plugin is very simple. To remove add to cart button WooCommerce with Remove add to cart WooCommerce plugins, 

  • Install plugin from WordPress plugin directory and activate it. 
How to Remove Add to Cart Button WooCommerce-WooCommerce QuickFix 10
  • Now navigate to Products and click on the edit button of the item for which you want to remove add to cart button. 
How to Remove Add to Cart Button WooCommerce-WooCommerce QuickFix 11
  • Scroll down and click on “Remove Cart Button”. 
  • From Alter Add to Cart Button, select “Remove Button”.

And your button will be removed. If you need to visualize then check the video below.

Using Elementor Page Builder

If you want more customizability and all in one solution then you can use Elementor page builder. To remove add to cart button WooCommerce, you need to have WooCommerce and Elementor pro version in your WordPress website. To remove or hide add to cart button WooCommerce

  • First, open your product page created with WooCommerce and elementor. 
  • On the below of your products add element named “add to cart button”.
How to Remove Add to Cart Button WooCommerce-WooCommerce QuickFix 12
  • Now remove “add to cart button” from the products, for which you want to hide add to cart button. 

Optionally you can fully customize the button in the way you want like rename “Add to Cart” text to “ Buy Now” or something else that you prefer. 

How to Remove Add to Cart Button WooCommerce-WooCommerce QuickFix 13

Just customize in the way you want from the element setting located on the left. If you wish you can entirely change your product page by adding an additional plugin called Widgetkit. It will not only help you with your WooCommerce page but also help you build your entire site. 

Preferred Way

So I think now you are a bit confused to choose the right tool for you. Am I right? Let’s clear confusion. If you have no previous idea then it is best to choose Elex plugin as it provides an easy solution. And if you are using any page builder plugin then go for Elementor

Conclusion

Let me ask you a question, do you need to search with the term “ how to remove add to cart button in WooCommerce” anymore?  Hope not. If you face any problem or have any queries as freely in the comment box. I will be happy to answer.

Similar Posts

Leave a Replay

Uzzal Raz
Uzzal Raz
Uzzal is Themesgrove's Technical Writer. WordPress has been Uzzal's favorite platform of choice since the beginning.

Follow Us

WP Onepager

The most beginner friendly page builder for WordPress.

WidgetKit For Elementor

Visually stunning and simple to use premium addons for Elementor Page Builder

Sign up for our Newsletter

Your privacy is important to us. We never share or sell any data to anyone.

Christmas Login

login

Don’t have an account? signup