How to change the cart icon in the header of vessel theme

Please I need help on how to change the cart icon of vessel theme. I have found the cart icon svg in the theme code but I don’t know what to do next.

Any help would be greatly appreciated. Thanks

Hi @SageUmeh ,
I hope this message finds you well.
Upload your new icon-cart.svg in the same Assets folder.
Shopify will overwrite the old one (or create a new file if you rename it).
Refresh your storefront → you’ll see the new cart icon.
If I was able to solve your issue, please don’t forget to like and mark it as solution,
as it may help others who have the same issue. If you need any further assistance, feel free to reach out to me.

Best
Anmol

Please click on the icon Reopen as source text icon at the top right, replace the code with your new cart icon svg code.

Make sure you copy the part contains class=”…” in the original cart icon of the theme and add it to your new svg code.

@SageUmeh you can upload your new cart icon, then delete this old cart icon and rename the new uploaded icon to this icon-cart.svg

please take backup of the icons before you delete them.

Hi @SageUmeh ,
You’re on the right track – that icon-cart.svg file you found is the actual SVG your theme is using for the cart. To change it, you have a couple of options:

  1. Replace the SVG code directly
  • Open icon-cart.svg in the code editor.
  • Delete the existing <svg>...</svg> content.
  • Paste in the SVG code of your new cart icon (you can grab it from any icon library like Heroicons or FontAwesome SVGs).
  • Save, and refresh your storefront – the new icon should appear.
  1. Swap with another file (if you want to keep the original)
  • Upload your new SVG file into the same /assets folder, e.g. icon-cart-new.svg.
  • Then search in the theme for where icon-cart.svg is referenced (look inside header.liquid or icon-cart.liquid).
  • Change the reference from icon-cart.svg to your new filename.

Hello @SageUmeh ,

I hope you are doing well!

Basically, you can delete the icon-cart.svg, add the new file an with the same name and edit the file to add the code.

Here are the steps to add SVG, which will help you design the section as per your needs:
1.) Go to Online store >> Themes >> Edit code >> Click on Assets >> Add file >> and save the file.

image

image1919×881 65 KB

Now, the SVG will appear. If you have any questions or need any help, feel free to reply here or messsage me.