There are several reasons why you would wish to conceal, delete, or deactivate the add-to-cart button on your WooCommerce site. As a result, additional customizability is required to change your store’s functionality to meet your needs.
I’ll teach you how to hide, remove and disable the add-to-cart button on WooCommerce stores in this article.
Remove, hide, and disable Add to cart button shop page
To delete this button, just add the following hooks to our child theme’s functions.php file:
<?php
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 );
?>Hide Add to cart button if is not users logged-in
<?php
if ( !is_user_logged_in() ) {
add_filter( 'woocommerce_is_purchasable', '__return_false' ); // in shop page
}
?>Remove Add to cart button by specific user role
<?php
add_action( 'wp_loaded','cxc_remove_cart_btn_by_subscriber_role' );
function cxc_remove_cart_btn_by_subscriber_role(){
// Get Current User By Role
$current_user = wp_get_current_user();
if( count( $current_user->roles ) !== 0 ) {
if( $current_user->roles[0] == 'subscriber' ) { // Remove add to cart button from subscriber.
add_filter( 'woocommerce_is_purchasable', '__return_false' );
}
}
}
?>Hide Add to cart button on specific products id
<?php
add_filter( 'woocommerce_is_purchasable', 'cxc_hide_add_to_cart_btn_on_specific_products_ids', 10, 2 );
function cxc_hide_add_to_cart_btn_on_specific_products_ids( $is_purchasable, $product ) {
if( $product->get_id() ){
if( in_array( $product->get_id(), array( 348, 181, 153, 154 ) ) ) {
return false;
}
}
return $is_purchasable;
}
?>Remove Add to cart button on the single product page
<?php
add_action( 'wp', 'cxc_remove_add_to_cart_single_product_page' );
function cxc_remove_add_to_cart_single_product_page(){
if( is_single( 181 ) ) { // "181" is a product ID as you remember
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );
}
}
?>Disable Add to Cart button on certain categories
<?php
add_action( 'woocommerce_single_product_summary', 'cxc_remove_product_categories_add_cart_button', 1 );
function cxc_remove_product_categories_add_cart_button() {
// Set HERE your category ID, slug or name (or an array)
$categories = array('posters');
//Remove Add to Cart button from product description of product with id 1234
if ( has_term( $categories, 'product_cat', get_the_id() ) ) {
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );
}
}
?>Remove Add to cart button for specific products temporarily and automatically display it after the date
<?php
add_filter( 'woocommerce_is_purchasable', 'cxc_hide_add_to_cart_button_until_date', 10, 2 );
function cxc_hide_add_to_cart_button_until_date( $is_purchasable = true, $product ) {
$current_date = date( 'Y-m-d' );
$release_date = date( 'Y-m-d', strtotime( '2023-01-07' ) ); // You can add date formate like ( Y-m-d ) by after show add to cart button
if( strtotime( $current_date ) < strtotime( $release_date ) && $product->get_id() == 181 ) {
$is_purchasable = false;
}
return $is_purchasable;
}
?>Customize to Add to cart button Text
<?php
// Change add to cart text on single product page
add_filter( 'woocommerce_product_single_add_to_cart_text', 'cxc_woocommerce_add_to_cart_button_text_single' );
function cxc_woocommerce_add_to_cart_button_text_single() {
return __( 'Cxc Add to Cart Button', 'cxc-codexcoach' );
}
// Change add to cart text on product archives page
add_filter( 'woocommerce_product_add_to_cart_text', 'cxc_woocommerce_add_to_cart_button_text_archives' );
function cxc_woocommerce_add_to_cart_button_text_archives() {
return __( 'Cxc Add to Cart Button', 'cxc-codexcoach' );
}
?>FAQ
How do I turn off the WooCommerce cart page?
You must get into your WordPress site’s backend to disable the WooCommerce shopping cart. Go to WooCommerce > Settings after that. Select the Advanced option on the Settings page, then Page setup. Locate the Cart Page area on the Page configuration page and pick the Disabled option from the drop-down bar.
-
CodexCoach is a skilled tech educator known for easy-to-follow tutorials in coding, digital design, and software development. With practical tips and interactive examples, CodexCoach helps people learn new tech skills and advance their careers.
