Replace “Add to Cart” by “Request a Quote” for specific category products ?

Hello,
I created a new layout for ‘single product’ and I replaced the ‘add to cart’ button with ‘request a quote’ button (showing a request form) for all products in the ‘accessories’ category.
How can I now hide or remove all the ‘add to cart’ buttons on the home page, product archive, quick view and related & upsells products only for the ‘accessories’ category (for example) with an add_action function or a css with display:none ?
Thanks for your help.
Best regards

Attachments:

You must be logged in to view attached files.

I got it working for all pages except for the popup ‘quick view’ !
If you have an idea… ;)) Thanks. Best regards.

document.addEventListener('DOMContentLoaded', function() {
    function retirerButtons() {
        document.querySelectorAll('.product_cat-accessories .wd-add-btn').forEach(button => {
            button.remove();
        });
    }
    retirerButtons();
    const produitContainer = document.querySelector('.products'); 
    if (produitContainer) {
        const observer = new MutationObserver(() => {
            retirerButtons(); 
        });
        observer.observe(produitContainer, { childList: true, subtree: true });
    }
});

Hi Chris,

Thanks for reaching to us and appreciate your patience.

Can you please try below one?

document.addEventListener('DOMContentLoaded', function() {
    function retirerButtons() {
        document.querySelectorAll('.product_cat-accessories .wd-add-btn').forEach(button => {
            button.remove();
        });
    }
    retirerButtons();
    const produitContainer = document.querySelector('.products, . product-quick-view.product'); 
    if (produitContainer) {
        const observer = new MutationObserver(() => {
            retirerButtons(); 
        });
        observer.observe(produitContainer, { childList: true, subtree: true });
    }
});

Regards,

Thanks for your response.
Best regards

[Author]

Posts