To change the button style "add to cart"

11 replies5 participantsUpdated by Eva Kemp

  • Avatar: vsehmogushiy
    vsehmogushiy
    Participant

    Hello, please tell me how to make buttons in the catalog and on the slider (add to cart) the same button on the item card. The screenshot https://yadi.sk/i/wviZsKF-g9NSn attached.

    #58548 Copied

    11 Answers

    Avatar: stan
    Stan Russell
    Participant

    Hello,

    please specify: do you want to have same ‘Add to cart’ button style for product category pages and single product pages?

    Regards,
    Stan Russell.

    #58637 Copied
    Avatar: vsehmogushiy
    vsehmogushiy
    Participant

    Yes!

    #58851 Copied
    Avatar: Robert Hall
    Robert Hall
    Participant

    Hello,

    Please add this code in custom.css file

    .etheme_add_to_cart_button{
color:#fff;
}

    Here is a video tutorial how to create custom.css: https://www.youtube.com/watch?v=Qok2zRedRMY&feature=youtu.be.

    Regards,
    Robert Hall.

    #58853 Copied
    Avatar: vsehmogushiy
    vsehmogushiy
    Participant

    Thanks, but not quite! The inscription itself “add to cart” when you hover poured the green button, but there is just stressed. How to do that? Preferably all the buttons to do so! https://yadi.sk/i/LUc4CmlogBwNE

    #59056 Copied
    Avatar: Brian Johnson
    Brian Johnson
    Member

    Hello

    You may try this code:

    .cart button{
color:white!important;
}
.cart button:hover{
color:transparent!important;  -moz-transform:    scale(1.1);
     -o-transform:      scale(1.1);
     -webkit-transform: scale(1.1);
     transform:         scale(1.1);
}

    With best regards
    Brian Johnson

    #59062 Copied
    Avatar: Robert Hall
    Robert Hall
    Participant

    Hello,

    Also please add following code in custom.css file

    .etheme_add_to_cart_button:hover{
color:#fff;
text-decoration: underline;
}

    Regards,
    Robert Hall.

    #59063 Copied
    Avatar: stan
    Stan Russell
    Participant

    Hello,
    please add following code to yours ‘custom.css’ file:

    .etheme_add_to_cart_button:hover {
color:white; text-decoration:underline
}

    Regards,
    Stan Russell.

    #59064 Copied
    Avatar: vsehmogushiy
    vsehmogushiy
    Participant

    When you add these codes began to merge button on the item card, and the problem has not disappeared as it was and remained…

    #59686 Copied
    Avatar: Eva
    Eva Kemp
    Participant

    Hello,

    Please try this one:

    .etheme_add_to_cart_button:hover{
color: #fff !important;
text-decoration: underline !important;
}

    Thank you.
    Regards,
    Eva Kemp.

    #59752 Copied
    Avatar: vsehmogushiy
    vsehmogushiy
    Participant

    Thank you with the goods issue resolved! But with the usual buttons for search and sorting the prices, nothing has changed., please write the code for them!

    #59786 Copied
    Avatar: Eva
    Eva Kemp
    Participant

    Hello,

    Please use this code:

    input[type="submit"]:hover, .woocommerce.widget_price_filter .price_slider_amount .button:hover, .woocommerce-page .widget_price_filter .price_slider_amount .button:hover {
   color: #fff !important;
   text-decoration: underline !important;
}

    Thank you.
    Regards,
    Eva Kemp.

    #59820 Copied

Want to reply? Log in, or register with your ThemeForest purchase code, to reply to this topic.

Login / Register