Changing the cart icon into Shopping cart instead of shopping bag with Item Count

Solved
New Member
10 0 0

Hi! I would like to ask for your help, how can I change the cart icon from shopping bag to shopping cart this is our shop. https://84zmuh900pjv3mgn-26446734.shopifypreview.com. Also, Is it possible to add the Item count when using mobile so that the user would know how many items were added this is the code that I added in the header.liquid

 

<a href="/cart" class="mob_show"> <span class="icon" aria-hidden="true">{% include 'asset_svg' with 'cart' %}</span> </a>

 

This is the css for that

.mob_show{display:none;position: absolute;right: 14%;width: 10%;top: 30%;} @media only screen and (max-width: 767px) {.mob_show{display:block;}}

 

0 Likes

can you share the code for asset_svg.liquid? . It must be inside snippets folder.

Available for hiring. Inbox me lixonic[at]gmail[dot]com
0 Likes
New Member
10 0 0
{% elsif icon_name == 'cart' %}
	<svg xmlns="http://www.w3.org/2000/svg" version="1.1" x="0" y="0" width="22" height="27" viewBox="0 0 22 27" enable-background="new 0 0 22 27" xml:space="preserve"><path fill="#010101" d="M17.1 6.6V6.3C17.1 2.8 14.2 0 10.7 0S4.4 2.8 4.4 6.3v0.4H0V27h21.2V6.6H17.1zM6.3 6.3c0-2.4 2-4.3 4.4-4.3s4.4 2 4.4 4.3v0.4H6.3V6.3zM19 8.8v16H2.2V8.8"/></svg>

Here is the cart code in asset_svg.liquid 

0 Likes

Success.

<svg viewBox="0 0 1196 1196" xmlns="http://www.w3.org/2000/svg"><path d="M1078.417 834h-711l49-66 582-1q11 0 20-7t11-19l80-447q2-15-7-26t-24-11l-742-2-8-37q-3-11-11.5-18.5t-19.5-7.5l-180 1q-13 0-22.5 9t-9.5 22 9.5 22.5 22.5 9.5h154l29 138 68 331-89 122q-12 16-3 33.5t29 17.5h94q-36 32-36 81 0 45 32 77.5t77.5 32.5 78-32.5 32.5-77.5q0-49-36-81h230q-36 32-36 81 0 45 32 77.5t78 32.5 78-32.5 32-77.5q0-49-36-81h153q13 0 22.5-9.5t9.5-22.5-9.5-22.5-22.5-9.5zm-37-515l-69 386-541 1-82-389zm-568 706q-19 0-32.5-13.5t-13.5-32.5 13.5-32.5 32.5-13.5 32.5 13.5 13.5 32.5-13.5 32.5-32.5 13.5zm378 0q-19 0-32.5-13.5t-13.5-32.5 13.5-32.5 32.5-13.5 32.5 13.5 13.5 32.5-13.5 32.5-32.5 13.5z"/></svg>

Use this instead. source https://github.com/leungwensen/svg-icon

Available for hiring. Inbox me lixonic[at]gmail[dot]com
0 Likes
Excursionist
36 0 1

Hi!

 

I want to do the exact same thing but the other way around. To change the shopping cart icon into a bag icon. Somewhere I know I picked the cart icon and that there was a possibility to have a bag icon (Venture theme) but can't find it anywhere. Also love to have the number count if possible. Anybody know how I can make this happen? Thank you from a lost "non-coder" trying anyway. :)

0 Likes