It’s no secret that customizing your online store allows you to stand out from your competitors. There are some obvious things you can edit such as the product pages, shop page, cart page, or checkout pages. However, other things are often overlooked and that have a huge impact on your site. In this guide, we’ll show you different ways to change the “No products in the cart” message.

We’ve previously seen how you can customize some elements of your online store that aren’t that obvious. For example, we’ve seen how you can change error messages at the checkout or show categories on the shop page. The same happens with the “No products in the cart” message. Most stores leave the default options, so by optimizing them you’ll stand out and get an advantage over your competitors.

Before we see how to change that message, let’s have a look at what that message is and why you should change it.

What is the “No products in the cart” message?

When you open an eCommerce store for the first time, your cart will be empty since you haven’t added any items to the cart yet. Similarly, it will also be empty if you add some items to the cart, but then remove them or buy them.

In these cases, by default, you will be greeted with the following message when you open the cart page: “Your cart is currently empty”. This is usually called the “No products in the cart” message.

Apart from seeing that alert on the Cart page, you might also find it in the mini cart if you have added the cart widget to any widget areas of your store as a mini cart.

Why change the “No products in the cart” message?

There may be several reasons why you may want to change this message. First, you can customize the text to make it more welcoming for your customers. A text that says “Your Cart is Empty! Please consider checking out our featured products!” for example, has a warmer tone than the default one. This way, you’re inviting your visitors to visit other pages of your store. Only a few online stores do this, so you’ll also be standing out from your competitors.

Additionally, you can translate your entire store into a particular language but your translation plugin might not translate that message properly. In this case, customizing the “No products in the cart” message manually provides you with better control.

Even though it has many customization options, WooCommerce doesn’t let you customize this message by default. However, in this guide, we’ll show you how you can customize the “No products in the cart” message.

How to change the “No products in the cart” message

There are 3 main ways to edit this message:

1. Programmatically
   1. Editing the function.php file
   2. Editing the mini-cart.php file
2. With a plugin

In the following sections, we’ll have a look at all the steps you should follow to change the “No products in the cart” message. These methods involve configuring your WordPress/WooCommerce files, so we recommend creating a full backup before starting.

1.1) Customize the “No products in the cart” message editing the functions.php File

For the first method, we will use a WooCommerce hook in your functions.php file. This process simply requires you to open your theme files editor and add a few lines of code to your function.php file.

Before moving on, we recommend you create a WordPress child theme if you don’t have one already. Child themes are a great way to add custom hooks and scripts to your theme files while making sure you can reverse the changes at any time. These changes persist even if you update your theme or the original theme files. If you don’t want to create one manually, you can also use any of these child theme plugins.

Let’s start by opening your WordPress Admin Dashboard and going to Appearance > Theme Editor. Then, click on the functions.php file on the right Theme files sidebar as shown below.

Using the editor in the middle, you can add the following script to your functions.php file:

remove_action( 'woocommerce_cart_is_empty', 'wc_empty_cart_message', 10 );
add_action( 'woocommerce_cart_is_empty', 'custom_empty_cart_message', 10 );

function custom_empty_cart_message() {
$html = '<div class="col-12 offset-md-1 col-md-10"><p class="cart-empty">';
$html .= wp_kses_post( apply_filters( 'wc_empty_cart_message', __( 'Insert Empty Cart Message Here', 'woocommerce' ) ) );
echo $html . '</p></div>';
}

[Code Snippet taking from here.]

This snippet will remove your default WooCommerce Empty Cart text and use another function to add a custom text instead. Simply replace the “Insert Empty Cart Message Here“ with the text you want for your “No Products in the Cart” message.

For example, if you want the message to say “Your Cart is currently empty, we recommend checking out our featured products!”, you can use this code:

remove_action( 'woocommerce_cart_is_empty', 'wc_empty_cart_message', 10 );
add_action( 'woocommerce_cart_is_empty', 'quadlayers_empty_cart_message', 10 );

function quadlayers_empty_cart_message() {
$html = '<div class="col-12 offset-md-1 col-md-10"><p class="cart-empty">';
$html .= wp_kses_post( apply_filters( 'wc_empty_cart_message', __( 'Your Cart is currently empty, we recommend checking out our featured products!', 'woocommerce' ) ) );
echo $html . '</p></div>';
}

Remember to update the file and you should see this result on the front end:

We saw that the “No products in the cart” message can also appear in the mini cart. Let’s see how to change it.

1.2) Change the “No Products in the Cart” text editing the mini-cart.php file

You can also choose to customize the “No products in the cart” message that appears in the mini cart. Instead of using a function for this, you can simply replace the empty mini cart text in your WooCommerce template files.

To do this, you need to configure your WooCommerce template files by going to Plugins > Plugin Editor on your WP Admin Dashboard.

Then, use the Select plugin to edit option to select WooCommerce and press Select. After that, click on Templates > Cart > mini-cart.php under Plugin Files.

By default, at the bottom of the cart you should see the following lines of code:

<?php else : ?>

<p class="woocommerce-mini-cart__empty-message"><?php esc_html_e( 'No products in the cart.', 'woocommerce' ); ?></p>

<?php endif; ?>

<?php do_action( 'woocommerce_after_mini_cart' ); ?>

You can simply edit this code by replacing the “No products in the cart” text with a custom text. For example, to change the text to ‘Please Consider Adding New Products’, you should use this code:

<?php else : ?>

<p class="woocommerce-mini-cart__empty-message"><?php esc_html_e( 'Please Consider Adding New Products', 'woocommerce' ); ?></p>

<?php endif; ?>

<?php do_action( 'woocommerce_after_mini_cart' ); ?>

Remember to save the changes and then you should see the changes on the front end.

2. How to Change the “No products in the cart” message with a plugin

We’ve previously mentioned that sometimes you translate your store into a particular language but the “No products in the cart” message doesn’t get translated. Let’s see how you can change that text with a translation plugin.

There are many plugins for enabling translations for custom strings. For this demonstration, we’ll use the Loco Translate plugin. It is one of the best translation plugins for WordPress and it has a built-in translation editor in the dashboard. This can be very convenient when customizing the “No product in the cart” message in your store.

1. Install and Activate the Plugin

First, install the plugin, by going to Plugins > Add New. Enter the keywords for the plugin, install it, and activate it.

Alternatively, you can install it manually. If you’re not familiar with that process, have a look at our guide on how to install a WordPress plugin manually.

Once you’ve activated the plugin, move on to the next step.

2. Translate the “Your cart is currently empty” message

Now it’s time to translate some strings. First, head to Loco Translate > Plugins on your WP Admin Dashboard. Click on WooCommerce on the plugins list to show all the available strings to translate and choose the language you’ll translate into.

You can also add the required language for your cart message from here. Simply click on New Language and add the desired language.

Then, use the Filter translations option to search for the right string you want to translate. To change the “No products in the cart” text, simply type in “Your Cart is currently empty”. Then, click on the Source text on the search results and add your custom string to the translation section.

For example, let’s set a custom translation for Spanish for our test website:

Once you finish the translation press Save. Now go to the front end, switch your site language and you’ll see the new translated message.

3. Translate the “No products in the cart” message

Using the same method, you can translate any string by simply searching for the text you want to change. In this section, we’ll focus on the ‘No Products in the Cart’ string, but you can set a custom translation for the Mini-cart text or any message that you want.

As we saw before, go to Loco Translate > Plugins > WooCommerce and choose the language you want to translate the string into. Then, search for “No products in the cart”, select the string, and add the desired translation.

Remember to save your changes, and you should see the result on the front end:

If you want more information about changing the language of your site, check out our full guide on how to change WordPress languages.

Bonus: How to Change Proceed to Checkout text

Apart from customizing the “No products in the cart” message, there are many other texts that you can change to make the most of every touchpoint customers have in your store. For example, you can edit additional texts such as Proceed to Checkout, Add to Cart messages, and many others. In the section, we’ll focus on how to change the Proceed to Checkout text using a simple WooCommerce function.

NOTE: As we’ll edit some core files, we recommend creating a full backup of your site and using a child theme.

To customize the Proceed to Checkout text, we’ll add a few lines of code to the functions.php file. To do this, go to Appearance > Theme Editor and click on the functions.php on the Theme files sidebar.

Now paste the following code while simply changing the “Insert-checkout-text-here” section with your custom message.

function quadlayers_woocommerce_button_proceed_to_checkout() { ?>
<a href="<?php echo esc_url( wc_get_checkout_url() ); ?>" class="checkout-button button alt wc-forward">
<?php esc_html_e( 'Insert-Checkout-Text-Here', 'woocommerce' ); ?>
</a>
<?php
}

For example, if you want the message to say “Please Move to Checkout here“, use the following snippet:

function quadlayers_woocommerce_button_proceed_to_checkout() { ?>
<a href="<?php echo esc_url( wc_get_checkout_url() ); ?>" class="checkout-button button alt wc-forward">
<?php esc_html_e( 'Please Move to Checkout Here', 'woocommerce' ); ?>
</a>
<?php
}

This should give you this result on the front end:

This is an example but there’s a lot more you can do to customize this text. For more information, check out our tutorial on how to change the Proceed to Checkout text. This guide explains why you should consider changing that text as well as the different ways to do so.

There are many more customizations that you can perform in your store. If that’s something you’re interested in, have a look at some of our guides to optimize the WooCommerce checkout, create one-page checkout, and even customize the WooCommerce checkout page. Similarly, you can use plugins such as WooCommerce Direct Checkout and WooCommerce Checkout Manager to help you improve the checkout process.

Conclusion

All in all, customizing the “No products in the cart” message allows you to personalize your customer’s journey and provide a better shopping experience. This is often overlooked by most store owners, so it can help you stand out from your competitors and boost your sales.

In this guide, we’ve shown you different ways to change the “No products in the cart” message in WooCommerce:

• Customizing the function.php file
• Editing the mini-cart.php file
• With a plugin

Now you should be able to edit the message and also adjust the translations that were missing.

Have you edited the “No products in the cart” text? Did you have any issues following this guide? Let us know in the comments below.

Finally, if you want to learn more about how to customize more elements of your WooCommerce store, check out some of these articles:

• How to remove the Additional Information tab in WooCommerce
• 3 Methods to Customize WooCommerce Cart Page
• Changing Currency in WooCommerce: The Full Guide
• How to customize the WooCommerce Shop Page