Home>Support>WooCommerce Colors

WooCommerce Colors

By ign, 6 years ago. Last reply by Andrew Misplon, 5 years ago.

Hello!
I´m using WooCommerce with a Vantage Premium theme. I´m also using the “WooCommerce Colors” pluging. Still, I can´t change some text colors. For example titles in the shop page, product names, product titles, links, etc.
How can I change them? Do I need to do some css?
My web site:
http://repuestos.cigue.com.ar/tienda/
http://repuestos.cigue.com.ar/producto/cadenas-para-nieve-mercedes-benz/

Thanks!

URL: http://repuestos.cigue.com.ar/tienda/

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 6 years, 9 months ago Daniel Hi, I Work Here

    Hi Ign

    You can fix/change this with some custom CSS. If you navigate to Appearance > Custom CSS, you’ll get our custom CSS editor. Just add the following code.

    .woocommerce #page-wrapper h1.page-title {
      color: red !important;
    }
    
    p.woocommerce-result-count {
       color: red !important;
    }
    
    #secondary .widget ul li a{
      color: red !important;
    }
    #secondary .widget ul li a:hover{
      color: orange !important;
    }
    
    .woocommerce ul.products li.product h3 {
     color: red !important;
    }
    
    .woocommerce ul.products li.product h3:hover {
      color: orange !important;
    }
    

    Change the color to the ones of your choice.

    Cheers

  2. 6 years, 9 months ago ign

    Thank you very much Addo!
    Great change!
    How can I do dthe same in every product page?
    Thanks!
    http://repuestos.cigue.com.ar/producto/cadenas-para-nieve-mercedes-benz/

  3. 6 years, 9 months ago Andrew Misplon Hi, I Work Here

    Hi Ign

    I’ve based the below off your existing Custom CSS from Addo. Remove the current Custom CSS you have and replace it with:

    /* WooCommerce General */
    
    .product_list_widget li a {
        color: #FAFAFA;
    }
    
    .woocommerce #page-wrapper h1.page-title,
    .woocommerce #page-wrapper .product h1.entry-title {
    	color: #FAFAFA;
    }
    
    p.woocommerce-result-count,
    .woocommerce .entry-summary p,
    .woocommerce .entry-summary .product_meta span {
    	color: #FAFAFA;
    }
    
    #secondary .widget ul li a{
    	color: #FAFAFA;
    }
    #secondary .widget ul li a:hover{
    	color: #FAFAFA;
    }
    
    .woocommerce ul.products li.product h3 {
    	color: #FAFAFA;
    }
    
    .woocommerce ul.products li.product h3:hover {
    	color: #FAFAFA;
    }
      
    /* WooCommerce Related Products */
    
    .woocommerce .related h2 {
    	color:#FAFAFA;
    	font-size: 18px;
    	margin-bottom: 1.5em;
    }
    
    .woocommerce .related ul li.product, 
    .woocommerce .related ul.products li.product, 
    .woocommerce-page .related ul li.product, 
    .woocommerce-page .related ul.products li.product {
    	width: 20%;
    }
    

    Let us know if we missed anything.

  4. 6 years, 9 months ago ign

    Thank you very much Andrew. It works great. I hope I can find the way to do the same at the home page.
    Thanks a lot!

  5. 6 years, 9 months ago Andrew Misplon Hi, I Work Here

    For sure.

    I looked at the home page now, can you advise what you’d like help on there?

  6. 5 years, 7 months ago Alexandros Lykostratis

    Hello everybody! I would like to change the colour of my product names, but can’t find it anywhere in the css editor. Can you help me? http://www.omegaproject3.com is my website (check out the shop>products section). Thanks!

    • 5 years, 7 months ago Andrew Misplon Hi, I Work Here

      Hi Alexandros

      You can fix/change this with some custom CSS. If you navigate to AppearanceCustom CSS, you’ll get our custom CSS editor. Just add the following code.

      /* WooCommerce */
      .woocommerce ul.products li.product h3 {
      	color: #0a0a0a;
      }
      

      Edit the above as requried.

      You might also need to install the SiteOrigin CSS Editor.

      For any follow-up questions, please, open a new support thread: Page: New Thread. Thanks.

  7. 5 years, 7 months ago Alexandros Lykostratis

    Thank you very much Andrew. You’re a life saver! It worked like a charm! And very quick response as well! Fantastic job!

    • 5 years, 7 months ago Andrew Misplon Hi, I Work Here

      Super :) Glad that helped. All the best with your site.

  8. 5 years, 7 months ago Joni Wijaya

    Hi..sory is this css code also work with other theme? I use woocommerce too,but other theme, and i want to change widget color too, such as best seller, price filter, etc.

    • 5 years, 7 months ago Andrew Misplon Hi, I Work Here

      Hi Joni

      Please, send a link to your site and we’ll take a look :)

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More