How to Change the Color of Product and Compare Price? shopify 2024

How to Change the Color of Product and Compare Price? shopify 2024

williamproject
New Member
9 0 0

i cant find the base.css, i wanna change color of product and compare price.

this is my link https://www.william-project.com/

Replies 16 (16)

lynth
Shopify Partner
107 5 14

Try going to the online store, then click on the three dots next to the customization button and select the edit code action. Next, find the CSS file. It might be named differently than base.css, depending on the theme. It could be custom.css or something similar. Then paste your styles there.

Screenshot 2024-07-08 at 19.52.54.png

If my tips are useful, just mark it as the solution. Cheers!
Feeling grateful? Buy me a coffee!
williamproject
New Member
9 0 0

should i try the 3 .css ?

williamproject
New Member
9 0 0

i only have those Captura de Pantalla 2024-07-08 a la(s) 12.40.10 p.m..png

Tal19
Shopify Partner
144 27 29

in your theme there is a file called styles.css

you can add the following css and change the color to your preferred one

span.was-price.theme-money {
    color: red;
}
Need Shopify Development, Customization, or POS Support? PM Me!
williamproject
New Member
9 0 0

great! it worked but i wanna put red on the price not the compared price

Tal19
Shopify Partner
144 27 29

If it's help please mark my answer as a solution 🙂

.product-block.cc-product-block.on-sale span.theme-money {
    color: red;
}
Need Shopify Development, Customization, or POS Support? PM Me!
williamproject
New Member
9 0 0

it worked but the problem is that now both are red Captura de Pantalla 2024-07-08 a la(s) 12.55.45 p.m..png

Tal19
Shopify Partner
144 27 29

Change the code of my first message to:

span.was-price.theme-money {
    color: #000;
}
Need Shopify Development, Customization, or POS Support? PM Me!
williamproject
New Member
9 0 0

Captura de Pantalla 2024-07-08 a la(s) 1.01.24 p.m..png

 

is this correct ?

Tal19
Shopify Partner
144 27 29

exactly

Need Shopify Development, Customization, or POS Support? PM Me!
williamproject
New Member
9 0 0

it didnt worked, is still red both

Tal19
Shopify Partner
144 27 29

replace #000; with #000 !important;

Need Shopify Development, Customization, or POS Support? PM Me!
lynth
Shopify Partner
107 5 14

try with this one:

span.was-price.theme-money {
  color: pink;
}
If my tips are useful, just mark it as the solution. Cheers!
Feeling grateful? Buy me a coffee!
williamproject
New Member
9 0 0

no, it didtn worked, can you help me with the complete code please ? just to put red and black please

Tal19
Shopify Partner
144 27 29

span.was-price.theme-money { color: #000 !important; }

Need Shopify Development, Customization, or POS Support? PM Me!
Tal19
Shopify Partner
144 27 29

@williamproject  it's working on your website, please mark my answers as a solution 🙂

Need Shopify Development, Customization, or POS Support? PM Me!