🔧This is a technical article which requires understanding of JavaScript.
Add-to-cart settings overview
You can find the Add-to-Cart Confirmation settings by navigating to Personalization > Appearance settings.
Available options
Notification Text
Use this field to customize the message displayed when a customer adds an item to their cart. For example:Default:
Item added to cart.Custom:
🎉 Success! {items} are now in your cart!
Notification Mode
Choose how the cart behaves after adding an item:Reload Page: Reloads the entire page.
Show Cart Drawer: Opens a cart drawer for a seamless shopping experience.
No Action: Keeps customers on the same page without any pop-up or reload.
Advanced add-to-cart customizations
For advanced behaviors, you can use the Custom JavaScript section. Below are examples:
Show a custom message when adding specific products
document.addEventListener('limespot:recommendationBoxLoaded', function (event) {
var box = event.detail.box;
box.querySelectorAll('.ls-add-to-cart-container button').forEach(button => {
button.addEventListener('click', function () {
var productTitle = button.closest('.ls-product-box').querySelector('.ls-product-title').textContent;
if (productTitle === 'Special Product') {
alert('🎉 You’ve added a special product to your cart!');
}
});
});
});
Automatically scroll to the shopping cart
document.addEventListener('limespot:recommendationBoxLoaded', function (event) {
var box = event.detail.box;
box.querySelectorAll('.ls-add-to-cart-container button').forEach(button => {
button.addEventListener('click', function () {
document.querySelector('#cart-drawer').scrollIntoView({ behavior: 'smooth' });
});
});
});🤔 Questions? Need help? Contact us via the in-app chat or email.