Developers · private preview

Two parts in your checkout, in an afternoon.

BlendPay is a script that draws one row above your payment options and a small REST API behind it. Your providers stay yours: we open their hosted pages, verify what they tell us, and keep a record of every step.

The API is in private preview with our design partners. Paths and fields may still change, and keys are issued at onboarding. Ask for access.

01 Add the row

One div where the row should sit, and one script.

<div id="blendpay"></div>
<script src="https://blendpay.co.za/blendpay.js" defer></script>

About 20 kB gzipped, drawn in a shadow root so your styles and ours never collide. If the script can't load, your checkout renders exactly as it did.

02 The shopper pays

The row does the work between your page and the providers.

It lists the methods that can be a part, opens the order, sends the shopper to each provider's own page in turn, and waits for both answers. Card numbers are only ever typed on the provider's page.

03 Confirm it

Show a confirmation in the browser. Fulfil from your server.

document.addEventListener('blendpay:paid', (event) => {
  // Good for a thank-you message. Not proof of payment:
  // read the order from your server before you ship.
});

API reference preview

A small API, with money in integer cents.

Every amount is an integer number of cents in rand: 1200000 is R12,000.00. Every write takes an Idempotency-Key header, so a retried request never charges or refunds twice.

MethodPathWhat it does
GET/methodsThe payment methods you have connected, their per-part limits, and which part each may be.
POST/checkoutOpens an order in one part or two, and returns the first provider page.
GET/orders/{id}The order's state, total and parts. What your server reads before it fulfils.
POST/orders/{id}/refundAsks the providers to refund an order, whole or in part.

Open a two-part order

R12,000.00, with R7,000.00 on a card and R5,000.00 on Payflex. The parts must add up to the total; the API refuses a split before either part starts if they don't, or if a part is outside a method's limits.

curl -X POST https://api.blendpay.co.za/checkout \
  -H "Content-Type: application/json" \
  -H "Idempotency-Key: 3f6c1e2a-order-1042" \
  -d '{
    "amount_cents": 1200000,
    "currency": "ZAR",
    "client_reference": "order-1042",
    "parts": [
      { "offering": "peach:card", "amount_cents": 700000 },
      { "offering": "payflex:payflex", "amount_cents": 500000 }
    ]
  }'

Order states

An order moves through a fixed set of states and never skips one. Refund states only follow a paid order.

created → pendingwaiting on a provider
paidevery part approved
awaiting_swappart 2 failed; the shopper can try another method
failed · cancelled · expiredended without payment
refund_pending → refundedor partially_refunded

Errors

Every failing request answers with the same envelope, quickly, so your checkout never waits on us.

{
  "error": {
    "type": "validation_error",
    "message": "Request failed validation."
  }
}

Building on WooCommerce or Shopify?

The script works on custom checkouts today. Plugins for the big platforms come next. Tell us what you run, and read how the engine is built in our tech stack.

Ask for access