The default Divi + WooCommerce menu shopping cart consists of a cart icon, the number of items and the text “Items”. Let’s make the menu cleaner by removing the “Items” text.

After

The Problem: No Option To Hide “Items” Beside The Cart

It’s easy to display the shopping cart icon and the cart quantity in Divi. But regardless if you use the Theme Builder menu or the Theme Customizer menu, you’ll face the same problem: There is no option available to disable the “Items” text to the right of the cart. Luckily, there are couple of ways to remove the “Items” text from the cart.

1. Method 1: Remove The “Items” Text With A Free Plugin

There is a nice free plugin called Say What? that lets you to change and remove text strings in WordPress without using custom code. If you aren’t a developer, it can be hard to know which strings to target. You could either use Say What Pro to discover and autocomplete strings. Or you can simply keep on reading this post, because I’ve found the right strings for you. And yes, it works both for Theme Builder and Theme Customizer menus.

1. Install and activate the free plugin Say What? from the WordPress plugin repository
2. Go to Tools » Text changes from your WordPress dashboard
3. Click Add New in the top left corner
4. Now, add these values in the fields:
   Original String: %1$s Items
   Text domain: Divi
   Text context: WooCommerce items number
   Replacement string: %1$s
   
5. Save by clicking the Add button
6. Click Add New again and add these values:
   Original String: %1$s Item
   Text domain: Divi
   Text context: WooCommerce items number
   Replacement string: %1$s
   
7. Save by clicking the Add button

That’s it! The final result should look like this:

Clear your website cache and test it by adding products in your cart in frontend. The “Items” text should not be displayed beside the Divi cart anymore.

Why two lines of strings?

If there are zero or multiple items in a cart, the default text is “Items“. The first row targets this string. If there is one single product in the cart, the default text is “Item“. The second row targets this string.

Method 2: Remove The “Items” Text With A Code Snippet

If you don’t want to use a plugin you can use a JavaScript snippet to remove the “Items” text. 

⚠️ Important: I recommend that you use method #1 above since removing content using JavaScript can make the hidden text display for a brief moment while the page loads. This is because the page content is displayed before the script is processed.

1. From your WordPress dashboard, go to Divi » Theme Options
2. Head over the the Integations tab and add this snippet to “the head of your blog” (“blog” is a misleading label since the code is applied to your entire website):

   <script>
       jQuery(function($){
           $('.et_pb_menu__cart-count, .et-cart-info span').text(function (_,txt) {
               return txt.slice(0, -5);
           });
       });
   </script>

3. Click the green Save Changes button.

That’s it! Clear your website cache and preview in frontend.

This snippet works both for Theme Builder menus (targeting the class et_pb_menu__cart-count) and Theme Customizer menus (targeting the class et-cart-info).

That’s all for today!

I hope that you enjoyed this post. Subscribe to DiviMundo on YouTube and join our Facebook group for more crisp content on WordPress and web design.

👉 Related post: Hide Cart (or “0 Items”) When Empty In Divi & WooCommerce

👉 Free course: Create a website from scratch with Divi