Notice: End-of-Life Announcement for all Shopify themes by Barrel > Read More

Close

Remove diamond icon around the Cart link in the header

This tutorial was written for version 1.0.7 of Mosaic. It should work for most other versions of the theme as well.

This tutorial will show you how to remove the diamond around the Cart link at the top right corner of the Mosaic theme.

By default, the Cart link looks like this:

before

Once you finish following the steps in this tutorial, the Cart link will look like this:

after

 

  1. Go to Edit HTML/CSS to edit the theme code. Shopify has a guide on how to do this here.
  2. Go to the Snippets folder and open the file called site-header.liquid.
  3. Look for the code that looks like this, starting around line 29, towards the end of the file:
    <a href="/cart" class="js-cartToggle cartToggle nav-item-fixed nav-item diamond-outline">
     <div class="diamond"></div>
     <div id="CartToggleItemCount" class="cartToggle-items">{{cart.item_count}}</div>
    </a>
  4. Simple delete the code in red above (the word “diamond”). Your code should now look like this:
    <a href="/cart" class="js-cartToggle cartToggle nav-item-fixed nav-item diamond-outline">
     <div class=""></div>
     <div id="CartToggleItemCount" class="cartToggle-items">{{cart.item_count}}</div>
    </a>

That’s it!