[Resolved] ‘Add to Basket’ button with white borders

Home Forums Support [Resolved] ‘Add to Basket’ button with white borders

Home Forums Support ‘Add to Basket’ button with white borders

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #1618108
    Juned

    Hi,

    Can I display ‘Add to Basket’ button with White Borders?

    If yes, then I can set hover background color and text color as per my choice.

    #1618244
    David
    Staff
    Customer Support

    Hi there,

    to add a border to the add to cart button requires some CSS:

    .woocommerce ul.products li.product a.add_to_cart_button {
      border: 1px solid #fff;
    }

    The button gets its colors from the Customizer > Colors > Buttons.
    If you want to set the Add to Cart button to a different color ( not matching the theme styles ) then you can use this CSS instead ( it includes the border ):

    /* Add to cart static color */
    .woocommerce ul.products li.product a.add_to_cart_button {
        border: 1px solid #fff;
        background-color: #0F0;
        color: #000;
    }
    /* Add to cart hover color */
    .woocommerce ul.products li.product a.add_to_cart_button:hover {
        border: 1px solid #fff;
        background-color: #f00;
        color: #fff;
    }
    #1619390
    Juned

    Thanks. It’s working perfectly.

    #1619392
    Juned

    Resolved

    #1619678
    David
    Staff
    Customer Support
Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.