Sales Badge - How to change color of the badge?

Comments

• Albert

  January 2017

  Hi,
  
  you can change its color with the following css:

  .woocommerce span.onsale, .shop_slider .shop_slider_ul li .item_wrapper span.onsale { border-top-color: #E3E3E3 !important; }

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• estoremalaysia

  January 2017

  Where should i add them in?

  
  

  I tried adding this into:

  woocommerce span.onsale, .shop_slider .shop_slider_ul li .item_wrapper span.onsale { border-top-color: #222222 !important; }
  

  
  

  but it doesnt work.  PLease advice .
• Albert

  January 2017

  Each custom css need to be put under Theme options > Custom CSS & JS > Custom CSS section.
  

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• estoremalaysia

  January 2017 edited January 2017

  Hi there, thank you.  It works now.

  
  

  One more question, how about changing the Review rating stars to other color?

  
  

  Currently the star color is brown.  I wanna change it to red.

  
  

  http://coco2u.com/product/coco2u-skincare-starter-kit-4-in-1/
  
• Albert

  January 2017

  You can change them with the following css:

  .woocommerce .star-rating span { color: #000 !important; }

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• nicolescheerer

  March 2020

  Sorry to hijack this case
  I have the problem that I get the same badge as the creator of the SALE - products.
  Can someone tell me how to remove the badge?
  Maybe I had installed a plugin in the past, which displays this badge (and also the CSS - code "<span class="onsale"><i class="icon-star"></i></span>").
  

  But I can't remember which plugin that was. Or is it a function of BeTheme or Woocommerce?

  Thanks a lot...
  
• nicolescheerer

  March 2020

  OK, found an solution:

  This is because a product has a price and a bid price. Woocommerce then automatically creates this "stupid" badge. With the CSS - Code
  .woocommerce span.onsale{
  display:none;
  }
  Can you hide this one. The badge from another plugin will still be displayed.