How to Change the Color of the Cart Icon in Divi

Categories: Divi, Woocommerce, Wordpress

In this article, I am going to teach you how to change the color of the WooCommerce shopping cart icon in Divi. By default, the cart icon appears on your main menu bar after a successful Woocommerce installation. It is very important to style the cart icon in accordance with the other items from your primary menu, since it is one of the first things that the customer will see on your website. As we all know, the devil is in the details, and I am sure you do not want to lose a customer because your website design is not as good as your competitors’. So, here is a simple css hack that lets you customize the shopping cart icon.

How to Change the Color of the Shopping Cart icon in Divi with CSS

Add the following css code in your Divi theme. There are a couple of options to do it, but I would recommend to navigate from the Wordpress Admin Toolbar to ThemeCustomizer => Additional CSS and paste the following code:

 .et-cart-info span::before {
    color: #007ABB;
}

The code will change the shopping cart color from black to blue. Feel free to change the color’s hex value to any other value you like.

If you also want to change the color of the search icon, you can modify your css code to include the search bar in the following way:

 .et-cart-info span::before, #et_search_icon {
    color: #007ABB;
}

Happy coding!

Read more: