How to Make Your WooCommerce Add to Cart Button Redirect to Checkout Page?

In WooCommerce stores, the primary reason for cart abandonment is a complex checkout process. Most likely, you have considered making the checkout process faster for better results, especially when selling digital products such as eBooks, online courses, downloadable items, etc. Having a user-friendly checkout process is highly efficient in such cases.

One common approach is to skip the WooCommerce cart page and guide customers directly to the checkout page. This can encourage them to complete their purchases and save time.

This post will guide you to make your Add to Cart button redirect to the checkout page.

Where to Add Custom Code in WooCommerce?

It is advisable to add the code snippets to the functions.php file of your child theme. Access the file directly from Appearance->Theme File Editor->Locating the child theme’s functions.php from the right sidebar. You can also access it from your theme’s directory file. Insert the following code snippet in functions.php. The alternative & easy option is to install & activate the Code Snippets plugin. You can then add the code as a new snippet via the plugin.

Preliminary Steps

• Go to the WooCommerce settings > “Products” section > “General” tab.
• Turn off both options: “Redirect to the cart page after successful addition” and “Enable AJAX add to cart buttons on archives”

Disabling the first option means that users won’t be redirected to the cart page, but the product will be added to the cart, and the piece of code in this post lets the user be directed to the checkout page.

Disabling the second option means the traditional page refresh will be used when adding products to the cart.

Solution: Make Your WooCommerce Add to Cart Button Redirect to Checkout Page

Imagine you have an online store that primarily sells digital downloads, such as e-books or software. In such cases, you want to provide them with the quickest and most seamless checkout experience possible. Instead of redirecting to the cart page, you can make the ‘Add to Cart’  button redirect users directly to the checkout page after adding a product. This can be achieved by using the provided code snippet:

add_filter( 'woocommerce_add_to_cart_redirect', 'ts_redirect_checkout_add_cart' );
 
function ts_redirect_checkout_add_cart() {
   return wc_get_checkout_url();
}

This to the shop owners who are running or planning to run BOGO offers on their WooCommerce store…

BOGO deals are great for increasing your sales, but have you thought about which offers are bringing you more revenue and which offers are not performing that great?

Don’t just set a BOGO deal, track the revenue generated by your deals in real-time with the Flexi BOGO for WooCommerce plugin.

Explore Flexi BOGO

Output

When a customer clicks on the ‘Add to Cart’ button, they will be directed to the checkout page directly, as shown below.

Code Explanation

1. The code uses the add_filter function to hook into the woocommerce_add_to_cart_redirect filter. This filter allows you to alter the default redirection behavior when a product is added to the cart.
2. Inside the function ts_redirect_checkout_add_cart, it uses the wc_get_checkout_url() function to determine the URL to which the customer should be redirected. This function retrieves the checkout page URL.
3. The return statement specifies that the user should be redirected to the checkout page URL when a product is added to the cart.

Conclusion

By implementing the code snippets discussed above, you can streamline the Checkout process by skipping the Cart Page for your customers. Furthermore, there are some options that you should explore to optimize your checkout page to reduce cart abandonment.