Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • #20627

    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.


    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;




    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?


    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!!!


    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??


    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.

Viewing 6 posts - 1 through 6 (of 6 total)

The topic ‘WooCommerce – want to change huge h1 and price color / Replete’ is closed to new replies.