Prestige Theme: Change price color and sale badge color

Store Design
1

Hello,

I am trying to change the color of the product price in the collection pages. I found how to do it in the theme elements with the “body light text”, however it changes also a lot of other text element such as text in the cart.

How can I change only the product price color?

Also, how can I change the sale badge color?

Capture d’écran 2020-02-25 à 12.47.25.png
Capture d’écran 2020-02-25 à 12.47.25.png2290×1154 183 KB

Thanks,

Melanie

2

Hello @rougeon ,

Please share your site url so that I will give you exact solution

3

Dear @oscprofessional ,

The site url is: https://ateliercomplice.myshopify.com/

Thanks!

4

@rougeon ,

  1. Go to Online Store->Theme->Edit code
  2. Asset->theme.scss.liquid->paste bellow code in bottom of file
.template-collection .ProductItem__PriceList.Heading span:not(.Price--highlight) {
	color: green;
}
.template-collection .ProductItem__Label.ProductItem__Label--onSale.Heading.Text--subdued {
	color: red;
}

Note:Please change color as per your requirement

5

Thank you @oscprofessional ! This worked perfectly!

6

Hi, I did the same thing but nothing happen. I’m using v4.5.5. Please help.

7

Hello @manhuynguyen ,

Can you please share your site url?

8

http://horad.co/ here it is. access password: 130196

9

Hello,

Please help. We have the same

issue, we want to change the color of the sale box to red and white font.

we tried the above solution and it didn’t work. Error message it couldn’t be saved

10

Please help

11

@oscprofessional Hi, can you please give some inputs on this. I’d really appreciate it.

12

Hi. I’m trying to I change the color of the sale box on my theme. I tried the first solution mentioned at the top of this post but it didn’t work. I have the prestige theme

13

@manhuynguyen ,

Add this css at the bottom of

Online Store->Theme->Edit code->Assets->theme.scss.liquid

span.ProductItem__Label.Heading.Text--subdued {
    color: red;
}
14

Hello @offcode ,

Can you please give me your site url so that I can check

15

@oscprofessional thank you very much. it changes the color of the word “On sale”. Can you also give code to change background of the “On sale” badge?

16

@manhuynguyen ,

Please add below css

span.ProductItem__Label.Heading.Text--subdued {
    background: black;
}

Note:You can change color as per your requirement

17

It works perfectly. Thank you very much @oscprofessional

18
19

@oscprofessional

www.offcodecompany.com

20

Hello @offcode ,

Add this css at the bottom of

Online Store->Theme->Edit code->Assets->theme.scss.liquid

span.ProductItem__Label.Heading.Text--subdued {
    color: white;
    background-color: red;

Note:You can change color as per your requirement.