Several Methods to Delete and Hide the WooCommerce Add to Cart Button

Foreign Trade Website BuildingA large portion of these businesses are engaged in B2B operations and do not require WooCommerce's online ordering Add to cart and pricing features, also known as Catalog Mode. Therefore, this article by Naiba shares several methods to remove Add to cart and pricing.

Method 1: Using a Plugin

YITH WooCommerce Catalog Mode

YITH WooCommerce Catalog Mode is a WordPress plugin whose main function is to enable catalog mode for WooCommerce, hiding the Add to Cart and Checkout buttons. The usage is very simple: download and install the plugin, then go to the plugin settings to enable the corresponding options.Download Link

MMWD Remove Add To Cart for WooCommerce

This plugin can also help us hide the Add to Cart and pricing content. After installing the plugin, go to WooCommerce settings, Products, and you can configure it in the Remove Add to Cart tab.Download Link

Method 2: Hiding in Theme Settings

Here, takingAstra Pro Themeas an example, after activating the WooCommerce feature in the theme options, go to the theme customizer settings, and you will see the option for Shop Product Structure. Simply turn off the Add to Cart function. Typically, some advanced WordPress themes include these settings; you can look carefully for the configuration options.

Method 3: Using Code

If your theme does not support hiding and you don't want to use a plugin to hide it, you can use the following two pieces of code to remove the shopping cart button.Code 1: Directly set the product to an unpurchasable state

add_filter( 'woocommerce_is_purchasable', '__return_false');

Code 2: Remove the add to cart button

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', 30 );

Code 3: Remove the price

remove_action( 'woocommerce_after_shop_loop_item_title', 'woocommerce_template_loop_price', 10 );
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_price', 10 );

// 另外一种移除价格方法
add_filter( 'woocommerce_get_price_html', 'naibabiji_remove_price');
function naibabiji_remove_price($price){ 
return ;
}

Code 1 directly sets the product to be unpurchasable. Compared to Code 2, it may have better compatibility because Code 2 directly removes the corresponding hook, which might cause display bugs on some themes. Through these three methods, we have achieved building a product showcase 2B website using WordPress and WooCommerce. Isn't it simple? Updated on August 13:

Method to Remove Add to Cart Button While Preserving Variable Product Information

Also using code methods

add_action( 'woocommerce_single_product_summary', 'hide_add_to_cart_button_variable_product', 1, 0 );
function hide_add_to_cart_button_variable_product() {

// 只删除购物车按钮和数量，保留variation
remove_action( 'woocommerce_single_variation', 'woocommerce_single_variation_add_to_cart_button', 20 );
}

If you haven't installed your own website yet, please refer to what Naiba shared:Steps to build your own website和WordPress Installation Tutorial

Related Content

Since you've seen this content about removing the add to cart button, you might also be interested in the following articles.

• Method to Modify the Default Add to Cart Button Text in WooCommerce
• How to Remove Related Products on WooCommerce Pages