Shopify themes, liquid, logos, and UX
Hi
Pls could u provide the solution to changing cart icon by using an image url or css code. (attached examples below)
Theme: warehouse
URL: tennisgiant.com
Wanted result:
current:
Cheers
@chrisjames11
Hello,
<svg class="icon icon--cart" viewBox="0 0 21.5 30" role="presentation">
<style type="text/css">
.st0{fill:#FFFFFF;}
</style>
<g transform="translate(0 1)" stroke-width="0" stroke="none" fill="currentColor" fill-rule="evenodd">
<path class="st0" d="M11.4,8.9c2,0,4.5,0,6.5,0c1,0,1.7-0.7,1.7-1.7c0-1.2,0-2.5,0-3.7c0-0.4-0.1-0.8-0.2-1.2C19,1,17.7,0,16.6,0
c0,0.1,0,0.2,0,0.4c0,1.1,0,2.1,0,3.2c0,1.1-0.6,1.6-1.7,1.6c-1,0-2.5,0-3.5,0C11.4,5.2,11.4,8.2,11.4,8.9z"></path>
<path class="st0" d="M6.5,5.2C5.7,5.2,5.2,4.8,5.1,4C5,3.7,5,3.5,5,3.2C5,2.1,5,1.1,5,0C4.9,0,4.8,0,4.7,0C3.2,0.3,1.9,1.7,1.9,3.3
c0,1.3,0,2.6,0,3.8c0,1,0.7,1.7,1.7,1.7c2,0,4.5,0,6.5,0c0-0.7,0-3.7,0-3.7C9,5.2,7.5,5.2,6.5,5.2z"></path>
<path class="st0" d="M11.4,2.9v1.7c1.7,0,3.3,0,3.8,0c0.2,0,0.4-0.2,0.5-0.3C15.9,4,16,3.7,16,3.4c0-0.7,0-1.5,0-2.3
c0-0.4,0-0.7,0-1.1C12.5,0,9,0,5.6,0c0,0.2,0,0.5,0,0.7c0,1,0,1.9,0,2.9c0,0.5,0.3,1,0.7,1c0.5,0,2.1,0,3.9,0V2.9H11.4z"></path>
<path class="st0" d="M0.6,13.6c-0.1,0.3-0.1,0.7-0.1,1.1c-0.1,1.4-0.2,2.8-0.2,4.2c-0.1,1.8-0.2,3.7-0.2,5.5c0,0.9,0.5,1.4,1.4,1.4
c0.2,0,0.3,0,0.5,0c0-4.3,0-8.6,0-13C1.3,12.7,0.8,13,0.6,13.6z"></path>
<path class="st0" d="M21.5,23.5c-0.1-1.9-0.2-3.8-0.3-5.7c-0.1-1.3-0.1-2.6-0.2-3.9c-0.1-0.8-0.6-1.2-1.4-1.1c0,4.3,0,8.6,0,13
c0.2,0,0.4,0,0.6,0c0.8,0,1.3-0.5,1.3-1.3C21.5,24.1,21.5,23.8,21.5,23.5z"></path>
<path class="st0" d="M19,9.7c0-0.1,0-0.2,0-0.3c-0.6,0-1.1,0.1-1.7,0.1c-1.8,0-5.9,0-5.9,0v10h-1.3v-10c0,0-4.1,0-5.9,0
c-0.5,0-1.1-0.1-1.6-0.1c0,0.1,0,0.2,0,0.4c0,5.7,0,11.3,0,17c0,1,0.4,1.7,1.3,2.2c1.1,0.7,2.4,0.9,3.7,0.9c2.2,0,4.4,0,6.6,0
c1.3,0,2.6-0.3,3.7-1.1c0.7-0.5,1.1-1.2,1.1-2.1C19,21.1,19,15.4,19,9.7z M6.4,17.8c0.4,0,0.9,0,1.3,0c0,2.5,0,5,0,7.6
c-0.4,0-0.8,0-1.3,0C6.4,22.8,6.4,20.3,6.4,17.8z M7.5,27.2c-0.2,0.2-0.5,0.2-0.8,0c-0.3-0.2-0.4-0.5-0.3-1.3c0.4,0,0.8,0,1.3,0
C7.7,26.4,7.8,26.9,7.5,27.2z M13.8,17.8c0.4,0,0.8,0,1.3,0c0,2.5,0,5,0,7.6c-0.4,0-0.8,0-1.3,0C13.8,22.8,13.8,20.3,13.8,17.8z
M14.9,27.2c-0.2,0.2-0.5,0.2-0.8,0c-0.5-0.3-0.3-0.8-0.3-1.2c0.5,0,0.9,0,1.3,0C15.1,26.4,15.3,26.9,14.9,27.2z M11.4,20.1
c0,0.5,0.2,1.1-0.6,1.4c-0.9-0.3-0.7-0.9-0.7-1.4H11.4z"></path>
</g>
</svg>
Go to your Online Store-> Theme->Edit code->Assets and search cart icon SVG file and replace this code.
This information is useful so please like and accept solution
Like THis
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024