How can I alter the cart icon on my website?

Store Design
1

Hey, how do I change the cart icon to the following icon?

https://9woq4h8aniz7oije-69711397132.shopifypreview.com

—Pngtree—black creative basketball ball net_4469095.png
—Pngtree—black creative basketball ball net_4469095.png2000×2000 58.5 KB

2

Hi @domo2

Thank you for reaching out to the shopify community.

In order to change the cart icon go to your theme code editor and search for file named icon-cart.liquid and icon-cart-empty.liquid in Snippets folder. There remove the svg code and add the below svg code in both the files -

Now the icon should have changed. You can change the height and width attribute of svg accordingly.

Harsita_0-1693548733995.png
Harsita_0-1693548733995.png1352×588 49.7 KB

Please give it a try, and let me know if this was helpful.

Thanks.

3

Thank you very much! Now the problem is the following: on the frontpage is has to be white and on the other pages like Shop or FAQ it has to be black. Can you hekp me with that please?

4

also changing height and width doesn’t work, dont know why

5

Hi @domo2

In order to change the color of the cart icon on specific page please follow the below steps:-

  1. Go to your theme code editor and search for a file named header.liquid in Sections folder.

2.In this file search for icon-cart, and add the below code after that.

{% if template.name == 'index'%}
  
{% endif %}

Screen shot for reference:-

Harsita_0-1693815671847.png
Harsita_0-1693815671847.png1053×575 31.8 KB

Now the color of the icon on home page would have been changed to white, similarly you can target any other page(like template.name == ‘product’ or template.name == ‘list-collections’) and change the color of the icon.

Thanks

6

it says the following:

  • Liquid syntax error (line 647): Unknown tag ‘{% if template.name == ‘index’’