I would like to change the appearance of my cart and simply display ‘CART’ as shown in the image I will send. I would also like it to use the same font that I’m currently using on my website, and I want to be able to adjust the font size myself.
here is an example :
here is my website link : https://embrace-the-grind.com/
Hi @embracethegrind,
Please try this CSS:
header-wrapper #cart-icon-bubble span.visually-hidden {
display: flex;
font-size: 15px;
width: auto;
height: 30px;
margin: 0;
position: relative!important;
align-items: center;
justify-content: center;
}
.header__icon--cart {
width: auto;
}
Hey @embracethegrind,
In order to do the requested changes requires to do the custom code in your theme file.
Could you please share the 4 digits collab code along with the store url in the p/m so that I can take a look and make the requested changes.
Thanks
Hi @embracethegrind,
Please go to Actions > Edit code > Find ‘icon-cart-empty.svg‘ and change code at sections/header.liquid file and sections/cart-icon-bubble.liquid file. Refer:
Please go to your store admin > Sales channels > Online Store > Themes > Customize > Theme settings > add the code below in Custom CSS.
.header__icon--cart > span.visually-hidden {
display: flex ! IMPORTANT;
width: auto;
Z-INDEX: 3;
clip: auto;
text-transform: uppercase;
font-size: 1.4rem; /* change font-size by changin 1.4rem in this line */
}
.header__icon--cart .svg-wrapper {
display: none !important;
}
Best regards,
Dan from Ryviu: Reviews & QA
Hi Dan it worked but when I had something it does this. Can you please put the number on the side like I show you on the first picture ?
Here is what I want
Hi @embracethegrind,
You can try my solution again, it will help you to change the icon, it will display well 
I cannot access your site now so I can’t check.
