This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

WooCommerce Colors

Open 11 replies premiumthemetheme-vantage
ign
11 years ago · Last reply by Andrew Misplon 9 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.

Need fast email support? Get SiteOrigin Premium

Replies

11
  1. Daniel Staff 11 years, 9 days ago

    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. ign 11 years, 9 days ago

    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. Andrew Misplon Staff 11 years, 7 days ago

    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. ign 11 years, 7 days ago

    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. Andrew Misplon Staff 11 years, 6 days ago

    For sure.

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

  6. Alexandros Lykostratis 9 years, 9 months ago

    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!

    • Andrew Misplon Staff 9 years, 9 months ago

      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. Alexandros Lykostratis 9 years, 9 months ago

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

    • Andrew Misplon Staff 9 years, 9 months ago

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

  8. Joni Wijaya 9 years, 9 months ago

    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.

    • Andrew Misplon Staff 9 years, 9 months ago

      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.

Have a different question or issue?

Start New Thread