Go to header.liquid file.
- Go to dashboard of shopify store
- Go to themes -> Actions -> Edit code
- Open Sections -> header.liquid
- Go to line: 495 and line: 497
- Delete the previous code from the files: icon-cart-empty.liquid and icon-cart.liquid
- Copy below code and paste in both those files.
<style>
svg g {
fill: red;
}
svg {
width: 30px;
}
.cart-count-bubble {
bottom: 27px;
left: -10px;
color: white;
background: green;
}
.cart-count-bubble span:first-child {
position: relative;
top: 1px;
}
</style>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0,0,1024,1024">
<desc>shopping_cart icon - Licensed under Apache License v2.0 (http://www.apache.org/licenses/LICENSE-2.0) - Created with Iconfu.com - Derivative work of Material icons (Copyright Google Inc.)</desc>
<g fill="#03b8e5" fill-rule="nonzero" style="mix-blend-mode: normal">
<path d="M182.19,85.33l40.1,85.34h631.04c23.47,0 42.67,19.19 42.67,42.66c0,7.25 -1.71,14.51 -5.12,20.48l-152.75,276.91c-14.51,26.45 -42.66,43.95 -74.66,43.95h-317.87l-38.4,69.54l-1.28,5.12c0,5.97 4.7,10.67 10.67,10.67h494.08v85.33h-512c-46.93,0 -85.34,-38.4 -85.34,-85.33c0,-14.93 3.84,-29.01 10.67,-40.96l57.6,-104.53l-153.6,-323.84h-85.33v-85.34zM384,853.33c0,46.93 -38.4,85.34 -85.33,85.34c-46.93,0 -84.91,-38.41 -84.91,-85.34c0,-46.93 37.98,-85.33 84.91,-85.33c46.93,0 85.33,38.4 85.33,85.33zM810.67,853.33c0,46.93 -38.41,85.34 -85.34,85.34c-46.93,0 -84.9,-38.41 -84.9,-85.34c0,-46.93 37.97,-85.33 84.9,-85.33c46.93,0 85.34,38.4 85.34,85.33z"/>
</g>
</svg>
Watch this complete video.
#