Add Track order icon on the header

hello. someone can help me plis i want to add a icon with a truck on the header to track orders…

Im using the DAWN THEME.

my page: https://raitom.com/

ICON:

https://www.reshot.com/free-svg-icons/item/delivery-truck-EBUG9Y4MZD/

Hi @raitom ,

Step 1: Go to Online Store → Theme → Edit code.

Step 2: Find the file header.liquid, and locate the code snippets I’ve marked here.

Step 3: Add this code above that


          
  

It will look like this

Replace track-order by the link to your track order page

If you don’t have a track order page, you can follow this video to create one: https://www.youtube.com/watch?v=bRQTqCbt9SE

I hope these instructions will help you. If they are helpful, please give us likes and mark as the solution.

Have a nice day!

1 Like

it work thank you very much. love it.

one more thing how can i put more space between the truck and cart ?

@raitom ,

Step 1: Go to Online Store → Theme → Edit code.

Step 2: Find the file base.css

Step 3: Add this code to the end of file

a[href="/pages/order-tracking"] {
    margin-right: 0px;
    margin-left: 12px;
}

Result:

1 Like

thank you bro it workk..

1 Like

hi there, when i just realise when i open the website on my iphone the icon doesnt show up on the screen can you help with this error pls

1 Like

@raitom , It is a bug on ios device. Both cart icon and track icon don’t show.

You can change the code in step 3 like this


          
  

In the icon-svg.liquid file, you can set the width and height for the SVG like this.

width="100%" height="100%"

Hope it helps

1 Like

what do i need to do to put the cart(bag) aswell… only the track order is there

@raitom , Did you find the “icon-cart.svg” file?

Please add this code after <svg

width="100%" height="100%"

It will look like

1 Like

Yes I did it