Ghost

Ghost is an open-source CMS for content creators and publishers. You can add Sanwo payments using Ghost’s code injection feature.

Setup

1. Add the script globally

Go to Settings → Code injection → Site footer and add:

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

This loads the Sanwo SDK on every page. It only activates when it finds elements with data-sanwo-provider.

2. Add a payment button to a post or page

In the Ghost editor, add an HTML card (type /html) 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"
>
  Pay ₦5,000
</button>

<style>
  .sanwo-button {
    display: inline-flex;
    align-items: center;
    padding: 14px 28px;
    background: #6366f1;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  }
  .sanwo-button:hover { background: #4f46e5; }
</style>

Custom amounts (donations, tips)

Perfect for supporting creators or accepting pay-what-you-want contributions:

<div
  data-sanwo-provider="paystack"
  data-sanwo-key="pk_test_xxxxx"
  data-sanwo-currency="NGN"
  data-sanwo-custom-amount="true"
  data-sanwo-button-text="Support this blog"
  data-sanwo-placeholder="Enter amount"
  data-sanwo-min-amount="100"
></div>

Per-page script injection

If you don’t want to load the script globally, add it per post using an HTML card at the bottom:

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

Handling results

<script>
  document.addEventListener('sanwo:complete', function(e) {
    if (e.detail.status === 'successful') {
      alert('Thank you for your payment!');
    }
  });
</script>

Tips

• Ghost HTML cards render directly in the page (no iframe) — the global script injection works
• The script only initializes buttons with data-sanwo-provider, so it won’t affect pages without payment buttons
• Use Ghost’s Members feature emails with the data-sanwo-email attribute for logged-in member payments
• For all available data attributes, see the Embed / CDN guide