Color and Font

Store Design
, , ,
1

Hi. Could someone please help me with changing the color of the “Sale” from black to red and also updating the font for the “Sale” text? Thank you!

My website is Last Chance – My Store (76efa0-54.myshopify.com)

Screenshot (28).png
Screenshot (28).png1839×821 220 KB

2

Hi @BLola ,

  1. To change the sale badge background color, please paste this css code in your theme stylesheet file.
.card__badge .badge {

  background-color: #dc143c;

}

Result:-

Sweans_0-1723801895193.png
Sweans_0-1723801895193.png1920×891 210 KB

  1. To change the font, hope the theme has the settings to update the font. If not, please let us know the name of the font that you need to update. If you need the custom font, you should upload the file into the assets folder, if you need the Google font, you can add the font on the theme.liquid file.

If you are facing any issues with the code editing process, please click on our profile send us a direct message, and share the collaborator store access. So we can check it and fix the issue ASAP.

I hope this helps! If it does, please like it and mark it as a solution!

If you need further assistance, feel free to reach out!

Regards,
Sweans

3

Thank you! It worked, but when I click on a listing, the ‘Sale’ color remains black. Do you know how I can fix this?

Screenshot (29).png
Screenshot (29).png1864×876 226 KB

4

Hi @BLola ,

Please add the below css in your theme stylesheet.

.badge.price__badge-sale {

  background-color: #dc143c;

}

Result:-

Sweans_0-1724043848732.png
Sweans_0-1724043848732.png1920×891 219 KB

I hope this helps! If it does, please like it and mark it as a solution!

If you need further assistance, feel free to reach out!

Regards,
Sweans

5

Thank you! One more question. Is it possible to change the ‘sold out’ text color to white instead of black?

photo_2024-08-19_10-15-57.jpg
photo_2024-08-19_10-15-57.jpg779×719 57.7 KB

6

Hi @BLola ,

We couldn’t see the ‘Sold out’ badge. Could you please share the product category link? So we can check it and let you know the solution.

Regards,
Sweans

7

Here is the link: Earrings – BUSYLOLA Thanks!

8

Hi @BLola ,

Could you please add the below CSS in the theme stylesheet.

.card__badge .badge, .badge.price__badge-sale {

  background-color: #dc143c;

  color: #fff;

}

Regards,

Sweans