How to add an upsell page to your Squarespace store

This code will redirect to the Upsell Page after clicking on the Add To Cart button.
All you need to set do is set upsellPageUrl and make sure express checkout is off.

If the Ajax Loading is enabled on a site, then this code must be added to the global Code Injection. If not, then it can be added to the shop header code injection or for specific products you can insert it in the addional info section.

<!-- Redirect to the Upsell Page after clicking on the Add To Cart button -->
<!-- Author: Dmitry Kiselyov @_dmitrykiselyov -->
<script>
function redirectToUpsellPage() {
  var upsellPageUrl = '/upsell-page';
  var addToCartButton = document.querySelector('.sqs-add-to-cart-button');
  var productVariants = document.querySelector('.product-variants');

  function isVariantInStock() {
    return productVariants.getAttribute('data-variant-in-stock');
  }

  function onClick() {
    if (productVariants && isVariantInStock() || !productVariants) {
      setTimeout(function() {
        document.location.href = upsellPageUrl;
      }, 1000);
    }
  }

  if (addToCartButton) {
    addToCartButton.addEventListener('click', onClick);
  }
}

document.addEventListener('DOMContentLoaded', redirectToUpsellPage);
window.addEventListener('mercury:load', redirectToUpsellPage);
</script>
<!-- end Redirect to the Upsell Page after clicking on the Add To Cart button -->

Want the upsell page to open in a lightbox?

You’ll need the Lightbox plugin and the code below.

<!-- Lightbox Upsell Page -->
<!-- Open an upsell page in a lightbox after clicking on the Add To Cart button -->
<!-- Author: Dmitry Kiselyov @_dmitrykiselyov -->
<script>
function redirectToUpsellPage() {
  var upsellPageUrl = '/upsell-page';
  var addToCartButton = document.querySelector('.sqs-add-to-cart-button-wrapper');
  var productVariants = document.querySelector('.product-variants');

  function isVariantInStock() {
    return productVariants.getAttribute('data-variant-in-stock');
  }

  function createLink(href) {
    var link = document.createElement('a');
    link.setAttribute('href', '#lightbox>' + href);
    return link;
  }

  function onClick() {
    if (productVariants && isVariantInStock() || !productVariants) {
      var link = document.querySelector('a[href="/upsell-page"]');

      if (!link) {
        link = createLink(upsellPageUrl);
        addToCartButton.appendChild(link);
        window.pluginLightbox();
      }

      setTimeout(() => link.click(), 1500);
    }
  }

  if (addToCartButton && window.pluginLightbox) {
    addToCartButton.addEventListener('click', onClick);
  }
}

document.addEventListener('DOMContentLoaded', redirectToUpsellPage);
window.addEventListener('mercury:load', redirectToUpsellPage);
</script>
<!-- end Lightbox Upsell Page -->