Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
I just can't find the solution to this anywhere!
However I do know exactly where to alter code for a new Cart Icon: .icon-cart:before { content: "\e600"; }
I've messed around with the code 'e600' and managed to get different icons, but none of them were the one I'm looking for. I just want to have a Bag instead of a Cart!
So my question is where can I find the codes for all the icons available because I'm convinced there's a Bag Icon somewhere in my backend.
Under Assets, I can see icons.tff, icons.woff, icons.eot and icons.json but when I click on them they're all blank!!
Please help its getting frustrating! Thanks
👋
Faced with the same problem. I'm going to test this example now. I'll give you an answer later. In the meantime, look at it.
www.huratips.com/tech-tips/how-to-add-font-awesome-to-your-shopify-store
Create a file in Snippets> icon.liquid
{% if icon == 'cart' %}
<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 24 24"><path d="M16 6v-2c0-2.209-1.791-4-4-4s-4 1.791-4 4v2h-5v18h18v-18h-5zm-7-2c0-1.654 1.346-3 3-3s3 1.346 3 3v2h-6v-2zm10 18h-14v-14h3v1.5c0 .276.224.5.5.5s.5-.224.5-.5v-1.5h6v1.5c0 .276.224.5.5.5s.5-.224.5-.5v-1.5h3v14z"/></svg>
{% endif %}
{% if icon == 'hamburger' %}
<svg width="30" height="30" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path d="M16 12c0-1.656 1.344-3 3-3s3 1.344 3 3-1.344 3-3 3-3-1.344-3-3zm1 0c0-1.104.896-2 2-2s2 .896 2 2-.896 2-2 2-2-.896-2-2zm-8 0c0-1.656 1.344-3 3-3s3 1.344 3 3-1.344 3-3 3-3-1.344-3-3zm1 0c0-1.104.896-2 2-2s2 .896 2 2-.896 2-2 2-2-.896-2-2zm-8 0c0-1.656 1.344-3 3-3s3 1.344 3 3-1.344 3-3 3-3-1.344-3-3zm1 0c0-1.104.896-2 2-2s2 .896 2 2-.896 2-2 2-2-.896-2-2z"/></svg>
{% endif %}
Open header.liquid and find:
<span class="icon icon-cart" aria-hidden="true"></span>
Below paste the following code:
<span aria-hidden="true">{% include 'icon' with 'cart' %}</span>
For example:
END.
Create your own snippet for each icon:
{%- if icon == 'NAME**' -%}
<svg></svg>
{%- endif -%}
U find the .svg codes on the internet.
Peace
Hey Community! As we jump into 2025, we want to give a big shout-out to all of you wh...
By JasonH Jan 7, 2025Hey Community! As the holiday season unfolds, we want to extend heartfelt thanks to a...
By JasonH Dec 6, 2024Dropshipping, a high-growth, $226 billion-dollar industry, remains a highly dynamic bus...
By JasonH Nov 27, 2024