Add logic to shopping cart that tells customers that they are X amount away from saving,

We are looking for ways to let customers know that they are X dollars away from being able to apply a discount code to save on their order. For example, if the miminum amount to apply a discount is $50 and the customer has spent $30, we would like a way to let the customer know that for just $20 more they can use a specific discount.

1 Like

Hello @blackcurrants ,

They are may apps available through which you can achieve it.

btw if you good with code you can follow this:

  1. Edit you cart template . File name depends on the theme you are using.

  You are $ away from saving on your order!

  1. Edit your theme js file or you can create a custom one

Place this code there

function calculateRemainingAmount(totalAmount, requiredAmount) {
  return requiredAmount - totalAmount;
}
 
function updateSavingsNotification() {
  const totalAmount = parseFloat(document.getElementById('cart-total').textContent);
  const requiredAmount = 50;

  const remainingAmount = calculateRemainingAmount(totalAmount, requiredAmount);

  if (remainingAmount > 0) {
    document.getElementById('amount-away').textContent = remainingAmount.toFixed(2);
    document.getElementById('savings-notification').style.display = 'block';
  } else {
    document.getElementById('savings-notification').style.display = 'none';
  }
}
 
updateSavingsNotification();
 
document.addEventListener('cart-update', updateSavingsNotification);

Thanks

Thank you for your response. Can you advise as to what those apps are?