How to Add a Clear Cart Button in WooCommerce?

September 5, 2023,

Adding a clear-cart button to your store might initially sound like a crazy idea. Nevertheless, it's worth exploring because of the benefits it brings along.

There are scenarios where enabling a clear cart button in your WooCommerce store becomes advantageous. This functionality can greatly benefit customers who prefer to empty their shopping carts with a single click. Additionally, it helps in preventing any potential discomfort among less content customers.

To add a clear-cart button in WooCommerce, you can opt for these two methods:

Use a clear cart WooCommerce plugin
Add clear cart buttons through code snippets

If you're involved in implementing the clear-cart button on your online store, this guide provides valuable insights. Join us as we walk you through the process of incorporating a clear-cart button into WooCommerce. Let's get started on this journey!

Ways to Add a Clear Cart Button to WooCommerce

It’s now time for us to delve into the process of adding a clear-cart button within WooCommerce. As the two methods mentioned previously to add a clear cart and session button in WooCommerce, we suggest you thoroughly explore these methods and then make your decision.

So, let’s explore each of these methods!

Using Code Snippets

Familiarizing yourself with the code snippet is crucial to adding a clear cart button to your WooCommerce store.

To ensure things go well and the code works properly, follow these steps:

Access your WordPress’s backend
Locate the “Plugin” section on the same interface
Now proceed to the “Add New” option
In the search bar, search for the “Code Snippet” Plugin or scroll down until you find it
Install and activate the code snippets plugin
Now locate the “Snippets” and “Add New” sections to add a new snippet
After clicking the Add New snippet, it is now time to name the snippet.
Once you create the snippet it is now time to add the below lines of code to the snippet
Once the code is added, save the changes

add_action('woocommerce_cart_coupon','custom_woocommerce_empty_cart_button');

function custom_woocommerce_empty_cart_button()

{

echo '<a href="' . esc_url( add_query_arg( 'empty_cart', 'yes' ) ) . '" class="button" title="' . esc_attr( 'Empty Cart', 'woocommerce' ) . '">' . esc_html( 'Empty Cart', 'woocommerce' ) . '</a>';

}

add_action( 'wp_loaded', 'custom_woocommerce_empty_cart_action', 20 );

function custom_woocommerce_empty_cart_action()

{

(isset($_GET['empty_cart']) && 'yes' === esc_html( $_GET['empty_cart'] ) )

{

WC()->cart->empty_cart();

$referer = wp_get_referer() ? esc_url( remove_query_arg( 'empty_cart' ) ) : wc_get_cart_url();

wp_safe_redirect( $referer );

}

Using WooCommerce Clear Cart Plugin

If you opt for a more efficient and expedient approach and are not inclined towards working with code, utilizing a plugin becomes essential. In such a scenario, the ideal choice is the "Clear Cart and Sessions for WooCommerce" plugin, which effectively aids WooCommerce store proprietors in incorporating a clear-cart button into their stores.

Here are the steps to add a clear cart button with a plugin:

Step 1: Install and activate the plugin

To enable this plugin for later use, installing and activating the plugin Clear Cart and Sessions is a must-do step.

Once you have purchased the plugin, these are the steps to follow:

Download the .zip file for a clear cart and session for WooCommerce plugin
Now upload the .zip file once you locate the “Plugins” and “Add New” sections
After uploading the file, click on Install
Once installation is complete, activate the plugin

Step 2: Configure the settings

Once the plugin installation and activation are done, it is now time to configure the plugin settings. To do so, follow these steps:

Go to WordPress WooCommerce > Settings and click Clear Cart and Session tab to configure this extension
Here you will find these three configuration settings
Session expire settings
Empty cart settings
Redirection settings

Let's learn more about these settings here:

1. Session Expire Settings

In this section, you can choose the time after which the session expires for the user and the cart is emptied once the session is over. In this settings section, you can choose the time formats and the time after which the session must expire, irrespective of the user being active.

2. Empty cart settings

In this section, you can enable the clear cart button on the cart page. Here, you can make further modifications to the WooCommerce clear cart button style, color, layout, button radius, and more to ensure it matches your store’s theme.

4. Redirection settings

In the field “Redirection Address," you will select the shop that you are going to redirect your customers to a store page or shop page. You also need to decide on the field "Activate." By checking this option, you enable redirection. On the other hand, you also need to specify the URL in which you are about to redirect customers.

Step 3: Save & Share Cart Section

Here in this section, you can make general settings related to the cart button, popup settings, and button general settings like its alignment. Moreover, you can also manage all the saved and shared carts.

Why Add a Clear Cart Button in WooCommerce?

There exist two primary motives for incorporating this type of button into your store. Could this button potentially streamline the process of customers choosing not to make a purchase? To provide you with enhanced clarity on the occasions and rationale for implementing this clear-cart button, refer to the key reasons outlined below.

Enhance customers’ shopping experience: The presence of a clear-cart button will aid customers in effortlessly and promptly removing items from their carts. By integrating this button into your store, you empower customers to independently manage item removal, thereby enhancing the overall shipping experience.
Boost sales in the long term: When customers experience satisfaction while shopping in your store, their likelihood of returning to make further purchases increases significantly. This, in turn, translates to substantial gains in boosting your long-term sales revenue.

Conclusion

In conclusion, adding a clear-cart button to your WooCommerce store can be a strategic move with several benefits. It enhances the overall shopping experience for customers by providing them with a quick and convenient way to remove items from their carts, which can lead to increased customer satisfaction and the likelihood of return visits. Moreover, it can boost your long-term sales revenue, as satisfied customers are more likely to become repeat buyers.

This blog has covered two methods for adding the clear-cart button: one using code snippets for those comfortable with coding and another through the use of the "Clear Cart and Sessions for WooCommerce" plugin. So, choose the method that fits your needs well; our personal suggestion is to use a plugin for better outcomes.