Home>Support>how to change view more button and buy now button colour

how to change view more button and buy now button colour

Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

I have Vantage Premium theme how to change colour view more button and buy now button .

URL: http://www.redkok.in

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

  1. 9 years, 7 months ago Andrew Misplon
    Hi, I Work Here

    Hi Anand

    The button colors, unfortunately, aren’t easily changed. Here is what you can try:

    1. Install and active this plugin:
    https://wordpress.org/plugins/woocommerce-colors/
    This plugins adds a new section in the Customizer, you’ll manage all WooCommerce colors, including your preferred button colors there.

    2. Add the following to Appearance > Custom CSS:

    /* Remove Vantage WooCommerce Button Styling */
    
    .woocommerce #page-wrapper .button {
    background: #000; /* Set this to your button background color */	
      border-top: initial;
      border-left: initial;
      border-right: initial;
      border-bottom: initial;
    color: #fff !important;
    cursor: pointer
      filter: initial;
      -webkit-border-radius: initial;
      -moz-border-radius: initial;
      border-radius: initial;
      -webkit-box-shadow: initial;
      -moz-box-shadow: initial;
      box-shadow: initial;
      width: initial;
      text-decoration: initial;
      /* Improves usability and consistency of cursor style between image-type 'input' and others */
      cursor: initial;
      /* Corrects inability to style clickable 'input' types in iOS */
      -webkit-appearance: none;
      line-height: initial;
      text-shadow: initial;
    }
    
    .woocommerce .button.alt,
    .woocommerce .button.alt:hover {
      background: none !important;
      background-color: #9d6fce !important; /* Set this to your button background color */
      border: none !important;
    }
    

    Where I’ve said:

    /* Set this to your button background color */
    

    Change the color value next to the note to match the color value set for buttons at Appearance > Customize > WooCommerce.

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