Remove cart icon Brooklyn them

[kfoggan]

How can I remove the cart icon from all pages and replace with a simple item count like "X Items" so the 'X' is the number of items added to basket?

[Jasoliya · Accepted solution]

Hi @kfoggan 

Follow this:

1. Open Section->header.liquid->find 1st {% if cart.item_count > 0 %} and comment whole code in this <a> tag and add bellow code in <a>

<span class="cart_c">{{ cart.item_count}} Items</span>

So it look like:

                <a href="/cart" class="site-nav__link site-nav__link--icon cart-link js-drawer-open-button-right good" aria-controls="CartDrawer">
                   {% comment %}
                      <span class="icon-fallback-text">
                        <span class="icon icon-cart" aria-hidden="true"></span>
                        <span class="fallback-text">{{ 'layout.cart.title' | t }}</span>
                      </span>
                      <span class="cart-link__bubble{% if cart.item_count > 0 %} cart-link__bubble--visible{% endif %}"></span> -->
                    {% endcomment %}
                    <span class="cart_c">{{ cart.item_count}} Items</span>
                 </a>

2. Open Asset->theme.js->find "theme.cache.$cartBuggle.addClass" and add this code above this condition:

 $('.cart_c').text(cart.item_count+" Items");

So it look like:

   $('.cart_c').text(cart.item_count+" Items");
    // Show cart bubble in nav if items exist
    if (cart.items.length > 0) {
      theme.cache.$cartBuggle.addClass('cart-link__bubble--visible');
    } else {
      theme.cache.$cartBuggle.removeClass('cart-link__bubble--visible');
    }

[EllisAntwi]

Hey sorry to bring this back up, but I followed the directions in this thread. It worked for the desktop site but not the mobile. Is it possible to let me know how to do the same for mobile? Thanks.

[Jasoliya]

Send your store url

[EllisAntwi]

ellisantwi.com thanks

[Jasoliya]

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss->paste bellow code in bottom of file

.icon-fallback-text .icon-cart{    display: none;}

[EllisAntwi]

Hello @Jasoliya, the code provided did not change the cart icon to #of items in cart. It just removed the menu bars on the left. Please let me know if you have another suggestion. Thanks for your time.

[Jasoliya]

If you have Brooklyn theme it must work. send your store url

[EllisAntwi]

ellisantwi.com

[Jasoliya]

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss->paste bellow code in bottom of file

.site-nav--mobile .js-drawer-open-button-right{    display: none;}