fbpx
Want To Add Extra Images Per Product Variation For Free? Download Now

Text of Add to Cart button changes when variations selected (Archive Page) – Bricks Builder

Eric Embacher

On my product archive page, I use the built-in Bricks Add to Cart button, with an icon and no text (on purpose). I also display variation swatches using the [wvs_show_archive_variation] shortcode. When variations are selected, the icon of the Add to Cart button is removed and the text (which was empty before) becomes “Add to Cart”. How can I prevent this from happening? I need the button to remain as it was designed and not change when variations are selected.

Page is here: https://oceansev.com/shop/

Hakik Zaman

Hi Eric,

Thanks for reaching out to us.

Please keep blank the Add to cart button selector field like this- https://paste.pics/QSG6B

Then try again. Hope to hear from you soon.

Thank You

Eric Embacher

If I do that, it disables all AJAX add-to-cart functionality (so clicking the add to cart button navigates to the product page rather than adding the product to the cart while staying on the same page).

Hakik Zaman

Hi Eric,

Add again the Add to cart button selector. Then, add the following snippet using the Code Snippets plugin or inside your current theme’s function.php file-

add_filter( 'woo_variation_swatches_archive_add_to_cart_text', function( $default, $variation, $product ){
return '<svg class="icon fill" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><!--! Font Awesome Pro 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M0 24C0 10.7 10.7 0 24 0H69.5c22 0 41.5 12.8 50.6 32h411c26.3 0 45.5 25 38.6 50.4l-41 152.3c-8.5 31.4-37 53.3-69.5 53.3H170.7l5.4 28.5c2.2 11.3 12.1 19.5 23.6 19.5H488c13.3 0 24 10.7 24 24s-10.7 24-24 24H199.7c-34.6 0-64.3-24.6-70.7-58.5L77.4 54.5c-.7-3.8-4-6.5-7.9-6.5H24C10.7 48 0 37.3 0 24zM128 464a48 48 0 1 1 96 0 48 48 0 1 1 -96 0zm336-48a48 48 0 1 1 0 96 48 48 0 1 1 0-96zM252 160c0 11 9 20 20 20h44v44c0 11 9 20 20 20s20-9 20-20V180h44c11 0 20-9 20-20s-9-20-20-20H356V96c0-11-9-20-20-20s-20 9-20 20v44H272c-11 0-20 9-20 20z"></path></svg><span>Add to cart</span>';
}, 10, 3 );

Note: It is recommended to add the Custom Code to the child theme’s functions.php file, to avoid any data loss while updating the Parent Theme.

Thank You