🛍️ Continue Shopping Button

This is a Javascript code that can be used on any site with a Business or Commerce subscription plan.

When your shopping cart is empty, Squarespace displays a continue shopping button. That button disappears when there is an item added to the cart. This code will force the button to stay even when products are in the cart.

How to use this code

This code is designed to work on your shopping cart page. Copy this code using the copy button on the right. It’s recommended that you add it to your site wide footer code injection.

You’ll find this under Pages → Custom Code → Code Injection → Footer

  • By default, the button links to the home page. To change that location for both buttons, use this additional code. 

<script>
document.addEventListener("DOMContentLoaded", function () {
  function insertContinueShopping() {
    const cartContainer = document.querySelector("#sqs-cart-container");
    if (!cartContainer) return;

    const originalBtn = cartContainer.querySelector('[data-test="continue-shopping-link"]');
    const customBtn = cartContainer.querySelector('.custom-continue-shopping');

    if (!originalBtn && !customBtn) {
      const btn = document.createElement("a");
      btn.href = "/";
      btn.textContent = "Continue Shopping";
      btn.className = "custom-continue-shopping sqs-editable-button sqs-button-element--secondary cart-continue-button";
      btn.style.cssText = "display:inline-block; margin-top:20px; float:right;";
      cartContainer.appendChild(btn);
    }

    if (originalBtn && customBtn) {
      customBtn.remove();
    }
  }

  insertContinueShopping();

  const cartRoot = document.querySelector("#sqs-cart-root");
  if (cartRoot) {
    const observer = new MutationObserver(() => {
      insertContinueShopping();
    });
    observer.observe(cartRoot, { childList: true, subtree: true });
  }
});
</script>
Previous

Rotating Testimonial Text
Next

Dark Mode Toggle