Change Original Price Color (Keep Sales Price Color)

Store Design
, , ,
1

Hi all,

I would like to change the sale price color from black to white (shown below) but leave the slashed price to red.

I only need the color changes made on the home page within the featured collection (not on other pages)

psimo90_0-1690950564455.png
psimo90_0-1690950564455.png1489×816 186 KB

2

Hey @psimo90

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

Moeed_0-1690951781669.png
Moeed_0-1690951781669.png1033×624 148 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

3

Forgot to mention… My theme is refresh. Should i be using this in base.css?

4

I suggest you to follow the steps I mentioned so in that way you won’t face any issue and the color of your regular price will be changed as well.

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

5

It worked, however because i have a white background on the product page, it also change the price color to white which now can’t be seen.

Is it possible to only change the price color in the featured collection?

psimo90_0-1690952189055.png
psimo90_0-1690952189055.png1247×615 136 KB

6

Hey @psimo90
Remove the previous code and add this new code

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

{% if template == 'index' %}

{% endif %}

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

7

Unfortunately it did not change anything. The price is still white on the product page

8

Hello @psimo90

You can try this code: it will be helpful to you

Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.

span.price-item.price-item--sale.price-item--last {
    color: #000!important;
}