add to cart button

I want to do the following on shop buttons on hover:

add to cart hover, for it to show ‘icon f11c add to cart’

when an item is added to cart, for it to have the button stay showing and say ‘added to cart’

for items that cant be purchased, the button to say ‘talk to the team’
on hover it says ‘view’

Hi admin-1319,

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

style to inherit the theme

Hi admin-1319,

1. Adding icon

Please add the following Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS:

.wd-product.wd-hover-buttons-on-hover a.add-to-cart-loop span::before,
.wd-add-btn-replace a.add-to-cart-loop span::before {
    content: '\f11c';
    font-family: 'woodmart-font' !important;
    position: absolute;
    left: 8px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    display: inline-block;
    color: #000 !important;
}

2. Change strings

Add the code below in Theme Settings -> Custom JS -> On document ready.

jQuery(document).ready(function($) {
    // Listen for WooCommerce's 'added_to_cart' event
    jQuery(document).on('added_to_cart', function(event, fragments, cart_hash, $button) {
        // Target the button with 'added' class and update its span text
        jQuery('.add-to-cart-loop.added').each(function() {
            $(this).find('span').text('Added to Cart');
        });
    });

    // Fallback: Update text for already-added buttons on page load
    jQuery('.add-to-cart-loop.added').each(function() {
        $(this).find('span').text('Added to Cart');
    });
});

Regards,
Hung PD

thank you

when an item has been added to cart, i want the button to not have any hover effect. so it just says ‘added to cart’.

Is it also possible for when added to cart the button stays showing on the product item, not just on hover?

Hi admin-1319,

Unfortunately, you requests require customization and out of our basic support. Thanks for understanding our limitations.

Regards,
Hung PD

[Author]

Posts