Squarespace

Setup

1. Add the script

Go to Settings → Advanced → Code Injection → Footer and add:

<script src="https://cdn.jsdelivr.net/npm/@sanwohq/embed/dist/sanwo.global.js"></script>

2. Add a payment button

On any page, add a Code Block and paste:

<button
  class="sanwo-button"
  data-sanwo-provider="paystack"
  data-sanwo-key="pk_test_xxxxx"
  data-sanwo-amount="500000"
  data-sanwo-currency="NGN"
  data-sanwo-email="customer@example.com"
  data-sanwo-callback="onSanwoPaid"
>
  Pay ₦5,000
</button>

<style>
  .sanwo-button {
    display: inline-flex;
    align-items: center;
    padding: 12px 24px;
    background: #0066ff;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
  }
  .sanwo-button:hover { background: #0052cc; }
</style>

<script>
  function onSanwoPaid(result) {
    if (result.status === 'successful') {
      window.location.href = '/thank-you';
    }
  }
</script>

Note

Code Injection requires a Squarespace Business plan or higher.

With email input

Collect the customer’s email before checkout:

<div style="display: flex; gap: 8px; align-items: center; flex-wrap: wrap;">
  <input
    type="email"
    id="customer-email"
    placeholder="Your email"
    style="padding: 12px; border: 1px solid #ddd; border-radius: 6px; font-size: 16px; min-width: 240px;"
  />
  <button class="sanwo-button" id="pay-btn">Pay ₦5,000</button>
</div>

<script>
  document.getElementById('pay-btn').addEventListener('click', async function() {
    var email = document.getElementById('customer-email').value;
    if (!email) { alert('Please enter your email'); return; }

    var sanwo = Sanwo.create({ provider: 'paystack', publicKey: 'pk_test_xxxxx' });
    var result = await sanwo.checkout({
      amount: 500000,
      currency: 'NGN',
      customer: { email: email }
    });

    if (result.status === 'successful') {
      window.location.href = '/thank-you';
    }
  });
</script>

Tips

• Use Code Blocks (not Markdown blocks) to add payment buttons
• Add the CDN script to Footer code injection so it loads on every page
• Style buttons to match your Squarespace template by adjusting the CSS
• Test on the live site — the Squarespace editor preview may not run custom scripts