Icon on add to cart button

Hi
I would to add an icon to add to cart button but see no option in elementor.
How can i do so?

Hi raz.sofer,

Thanks for reaching to us.

Provide me with the mockup of the styles that you try to achieve and we’ll send proper instructions if it’s possible.

Kind Regards,
Hung PD

Thanks Hung. I want to add a cart / bag icon near the text permanently or on hover. Similar to header icon.
I have seen this in other elementor sites but I guess they use a different theme.

Hi raz.sofer,

To assist you in the best possible manner, I kindly ask that you please provide me temporary wp-admin info (wp-admin URL, username, password) to the Private Content area, this will allow me to thoroughly investigate and address your concerns more efficiently.

Kind Regards,
Hung PD

attached

Hi raz.sofer,

.wd-product.wd-hover-fw-button .wd-add-btn a.add-to-cart-loop span {
    padding: 12px 0 12px 12px;
}

.wd-add-btn-replace a.add-to-cart-loop:before {
    position: static;
    transform: none;
    content: "\f105";
}

.wd-add-btn-replace a.add-to-cart-loop:hover span {
    transform: none;
}

Kind Regards,
Hung PD

Thank you Hung!
The code you sent is for the product archive. I need the icon to show up on “.single_add_to_cart_button” class.
Should I just replace the classes you sent?

Hi raz.sofer,

Please use below code:

button.single_add_to_cart_button:before{
    transform: translateY(0);
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 400;
    font-size: 20px;
    transition: opacity .15sease, transform .25sease;
    content: "\f123";
    font-family: "woodmart-font";
    position: relative;
}

button.single_add_to_cart_button.loading:before{
    opacity: 0;
}

Kind Regards,
Hung PD

Thank you Hung!

[Author]

Posts