WooCommerce - want to change huge h1 and price color / Replete « Support Forum | Kriesi.at

Support Forum » Replete

WooCommerce - want to change huge h1 and price color / Replete

6 posts from 2 voices

Started 2 months ago by creatorofstuff
Latest reply from Devin
This topic is resolved

Tags:

creatorofstuff
Member

I'm wasting too many hours doing the same thing over and over so I have to ask. I've used Firebug to find the css for the size of the gigantic product description, and can make it change in Firebug, but nothing I do makes it change from my custom css file. I've tried so many variations I've lost count. Can you please tell me the exact code to use? It's proportionally huge, and on a mobile device it's downright massive!

I would also like to be able to change the color of the price. I can't even make that work in Firebug.

Posted 2 months ago #
Devin
Moderator
Hi creatorofstuff,

Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files:
```
#top.single-product h1.product_title {
font-size: 30px;
}
```
And for the color of the price, you can use:
```
#top.single-product .price span {
color: #C00;
}
```
Regards,

Devin
Posted 2 months ago #
creatorofstuff
Member

Hi Devin,
Thanks for the reply. I'm baffled because I first put the code in my custom.css file, which is where I have been putting all of my custom css. It did nothing. But when I tried putting it in my quick css it actually worked. Can you explain why this might be happening? Isn't it bad to use the quick css? What if you update the theme? Won't that code get written over?

Posted 2 months ago #
creatorofstuff
Member

I also just noticed that the only place the price has changed color is on the individual page. It is still the wrong color on the homepage with featured products, and the shop page that contains multiple products. Sorry, but can you tell me the code for those, too? I'm still baffled about why this does not work in the custom.css. I played around to make sure that file is working (I changed some of the other code in it to be sure and it is, indeed, a working file).

Thank you!!!

Posted 2 months ago #
creatorofstuff
Member

Is this it? (Or do I have too much code in there?) It seems to work...

#top .main_color .price, .main_color .stock, #top #wrap_all .main_color ins {
color: #CC0000;
}

Again, it works ONLY in quick css, but not in my custom.css. This is so wierd. Why is this??

Posted 2 months ago #
Devin
Moderator
Try linking directly to your custom.css file in your browser, if you aren't able to pull it up then there could be a weird permissions issue going on.

The code I provided above is specifically for the single page, you can just remove .single-product to have that price change effect the site prices everywhere and then add !important just to make sure it is always the most important rule as well:
```
#top .price span {
color: #C00 !important;
}
```
Also, no css in the Quick CSS filed will be lost on updates. It is treated as a theme option which are never lost when updating the theme.
Posted 2 months ago #