• devilkin

    (@devilkin)


    Hello,

    I’m trying to change the “proceed to checkout” button colour from the default purple to something else (more reddish).

    I can’t use the colour picker in WC’s settings since the files aren’t writable from the webserver.

    I’ve added the following css to my theme’s style:

    .woocommerce a.button.alt, .woocommerce-page a.button.alt, .woocommerce button.button.alt, .woocommerce-page button.button.alt, .woocommerce input.button.alt, .woocommerce-page input.button.alt, .woocommerce #respond input#submit.alt, .woocommerce-page #respond input#submit.alt, .woocommerce #content input.button.alt, .woocommerce-page #content input.button.alt {
      background: -moz-linear-gradient(center top , #d25151 0px, #96588A 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
      border-color: #76456C;
      color: #FFFFFF;
      text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6) !important;
    }

    yet nothing seems to change. I’m getting a bit lost in WC’s CSS though.

    https://wordpress.org/plugins/woocommerce/

Viewing 3 replies - 1 through 3 (of 3 total)
  • lorro

    (@lorro)

    Hi, Have you tried a css checking service, there are several, for example:
    CSS Lint and http://www.css-validator.org. Your css doesn’t seem to be doing too well, though I can’t tell if any of the issues raised in the checkers is fatal.

    Hello devilkin,

    You are only adding background for Firefox, try to add gradient for other browsers too with webkit prefix and without any prefix.

    Thread Starter devilkin

    (@devilkin)

    Ah. Thanks… there I was assuming CSS would be browser-agnostic 😉

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Change button colors through CSS’ is closed to new replies.