Change cart icon on Publisher theme

Store Design

Topic summary

Issue: Changing the cart icon in the Publisher theme only affects the empty state; when an item is added, it reverts to the default icon because the theme uses separate icons for empty vs. filled states.

Key points:

  • The theme uses two SVGs: icon-cart-empty.svg (empty) and icon-cart.svg (when items are in the cart). Both must be replaced to keep the custom icon consistent.
  • Editing via header.liquid alone won’t cover the filled-cart icon.

Suggested solutions:

  • Replace the SVG code in both icon-cart.svg and icon-cart-empty.svg with the custom SVG.
  • In Theme Editor: Online Store > Themes > Customize > Header section. Look for Cart icon/Cart style/Cart drawer/mini-cart/Header icons options to change or upload the icon, then Save.

Clarification:

  • When opening these SVG files, the editor may show an image preview. Click the editor’s toggle/button to view and paste the SVG code (a screenshot was provided to indicate this control).

Requests/Offers:

  • Assistance requested for store URL and a screenshot; another participant offered hands-on help if the icon file is provided.

Status: Unresolved/ongoing; user has not confirmed success after switching to code view and updating both SVGs.

Summarized with AI on December 11. AI used: gpt-5.
1

How do I change the image of the cart on Publisher theme? I’ve managed to change the empty cart image from header.liquid but whenever I add an item to my cart it reverts back to the default image.

2

Ah, I see what’s happening. In the Publisher theme, the cart is reverting because the theme uses two different icons, one for the empty cart and another for when items are added. You’ll need to find that second icon in the theme files and replace its SVG with the custom one you already added.

3

Hi, @Jarch1
Can you share the store URL and take a screenshot to describe your requirements? So that I can assist you.

4

You can open icon-cart.svg and icon-cart-empty.svg, relace svg code of those files with your own

5
  1. Go to Online Store > Themes > click Customize. This will open Theme Editor.
  2. Open the Header Settings, At the top of the preview, click the Header section
  3. Look for options related to Cart icon, Cart style, Cart drawer or mini-cart, Header icons
  4. Change or Upload the Cart Icon
  5. Save
6

I tried doing this but opening these two it just shows the actual image and not any code.

7

Yes, you are right.

Initial you will see the SVG image. In order to get it’s code you need to click on the icon that shared below.

image
image1886×919 68.2 KB

2 Likes
8

@Jarch1 i can help you for change cart image. if possible for you. and you have what image / svg icon for your cart?