Hello,
I need help with adding a nicer items cart counter.
at the moment its this one "cart (2) " i would like to have a black circle with the number of items in the cart.
I manged to change the cart icon and add the cart items counter but its stuck like that.
I want it to look like the second reference image.
anyone that knows how to do it?
My theme at the moment is " simple"
thank you!
Hello,
Please share your website URL.
Here you go!
**Replace this code:-**
<span class="cart-link__bubble" cart-link__bubble-="" <span="">{{ 'layout.cart.title' | t }}(<span id="CartCount">{{ cart.item_count }}</span>)</span>
**With This:-**
<span class="cart-link__bubble" cart-link__bubble=""><span id="CartCount">{{ cart.item_count }}</span></span>
After replacing the HTML code, Add the following code to the theme.css file.
.cart-link__bubble.cart-link__bubble--visible {
display: none;
}
.site-header__cart {
position: relative;
}
#CartCount {
background-color: black;
color: white;
width: 22px;
height: 22px;
display: inline-flex;
text-align: center;
align-items: center;
justify-content: center;
border-radius: 30px;
position: absolute;
left: 0px;
top: -64px;
}
Before adding this code to the theme, you should make a backup of the theme.
where do i find the code i need to replace?
just found it. huge thanks
Thank you