How can I change the cart icon in the dawn theme?

Store Design
, ,

Topic summary

A user seeks help replacing the cart icon on their Dawn theme Shopify store with a custom SVG icon they’ve uploaded to their CDN.

Current Issue:

  • The user has located the icon-cart-empty liquid file containing the existing cart icon code
  • They’re unclear about the exact process for replacing the old SVG code with the new one
  • Specifically confused about which URL or code snippet to replace

Guidance Provided:

  • Open the custom icon’s CDN link, right-click on the icon, select “Inspect” to view the SVG code
  • Copy the entire <svg> element from the browser’s developer tools
  • Navigate to: Online Stores > Themes > More Actions > Edit code
  • Search for “cart” or “icon-cart” in the code editor search bar
  • Locate the icon-cart-empty file and replace the existing SVG code with the copied SVG
  • Note: PNG format won’t work; must use SVG code

Status:
The discussion remains ongoing as the user continues to struggle with understanding Step 4 (pasting the SVG code into the liquid file). The helper is requesting a screenshot of the opened file to provide clearer guidance.

Summarized with AI on November 17. AI used: claude-sonnet-4-5-20250929.
1

Can someone pls help with changing my cart icon - https://milkymotorsports.com/

I want to use this icon - https://cdn.shopify.com/s/files/1/0574/6429/1511/files/shopping-cart.svg?v=1693345286

Here’s the code in “icon-cart-empty” -

<svg
  class="icon icon-cart-empty"
  aria-hidden="true"
  focusable="false"
  xmlns="http://www.w3.org/2000/svg"
  viewBox="0 0 40 40"
  fill="none"
>
  <path d="m15.75 11.8h-3.16l-.77 11.6a5 5 0 0 0 4.99 5.34h7.38a5 5 0 0 0 4.99-5.33l-.78-11.61zm0 1h-2.22l-.71 10.67a4 4 0 0 0 3.99 4.27h7.38a4 4 0 0 0 4-4.27l-.72-10.67h-2.22v.63a4.75 4.75 0 1 1 -9.5 0zm8.5 0h-7.5v.63a3.75 3.75 0 1 0 7.5 0z" fill="currentColor" fill-rule="evenodd"/>
</svg>
  
2

Hi @milkymotorsport

This is Noah from PageFly - Shopify Page Builder App

You can follow my steps below to change the cart icon

Step 1: Click on the CDN links of the shopping-cart icon you want to display.

Step 2: Move your mouse into the icon, then right click > Inspect > You will see a tab like this

Step 3: In that panel, you will see the tag which is the icon, you can select it and copy the element like this screenshot ( right click on the svg and copy )

PageFlyNoah_0-1693356620116.png
PageFlyNoah_0-1693356620116.png2879×1524 377 KB

Step 4: Replace the old icon by paste the svg you just copied into the “icon-cart-empty” liquid file

Hope this can help you solve the issue

Best regards,

Noah | PageFly

3

I’m sorry but this still leaves me at the step I’m on - replacing the image, IDK where to put it

4

@milkymotorsport Once you have the svg copied. You will need to replace the cart-icon from your theme. And that is icon-cart-empty file, the place you sent all the code above.

Each theme will have different name file

However you can search for the “cart”, “cart-icon” And it should be in Snippets of the theme

5

Yes, I know, but the help I’m looking for here is which URL do I replace the old icon with the new icon. I understand how to do everything else. Replacing the value for “xmlns” doesn’t work. This is what I need help with. If you could provide the full code that would be helpful with this image URL - https://cdn.shopify.com/s/files/1/0574/6429/1511/files/cart-icon.png

6

Every cart-icon of the theme is displayed with the svg, so the only way you can change the cart-icon is follow my step above to get the svg of your new icon, then replace it with the new one.

The png here, won’t work, you can only get the svg from the first link you sent in the thread.

7

I’m sorry but your directions are unclear

8

Let me know which steps you are having trouble with?

9

Step 4: Replace the old icon by paste the svg you just copied into the “icon-cart-empty” liquid file

-this doesn’t make sense

10

The file name is the file you posted from the thread.

You can follow this

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on the search bar, search for: cart or icon-cart then replace the svg you copied.

If you can screenshot the file you opened. It would be great