Storefront: Change the basket icon to a cart icon

Someone asked me today, why does the shopping cart had an icon of a basket instead of a cart?  It’s called the “cart” after all, right?  The URL says cart, and WooCommerce says cart, but there’s an icon of a basket.

Here you can see the default “cart” icon on the Storefront menu:

It also appears on mobile in the “handheld menu” on the bottom:

If you want to change these icons from a basket to a cart, here’s a bit of CSS I wrote that will do the trick (as of Storefront 2.2.4):


.site-header-cart .cart-contents:after,
.storefront-handheld-footer-bar ul li.cart > a:before {
content: "\f07a";
}

Result:


5 responses to “Storefront: Change the basket icon to a cart icon”

  1. Thanks Mike, this was helpful.

  2. cool! Just tried it and seems better!

  3. Where to change it?

    1. mikeyarce Avatar
      mikeyarce

      You can add this CSS in the Customizer > Additional CSS section.

  4. thanks !!


Leave a Reply to makis Cancel reply

%d bloggers like this: