SDK Overview

A lightweight JavaScript SDK that allows you to embed secure payment and card-update experiences directly into your website, without handling sensitive financial data on your servers.

The Web SDK powers two core components:

• Checkout Form SDK → Embedded payment form for subscription & one-time purchases

• Card Update SDK → Allows existing subscribers to update their saved credit cards

Both components are fully PCI-compliant, mobile-responsive, and work seamlessly with Zotlo’s billing engine.

What You Can Do With It

The SDK enables you to:

Embed a checkout form

• Accept subscription and one-time payments

• Use plan-level pricing, trials, country-based currency

• Receive webhook notifications for all transactions

• Customize the form’s design using the style config

Update saved cards

• Let subscribers replace their payment card securely

• Trigger 3D Secure flows when needed

• Continue the subscription lifecycle without interruption

Track steps of the process

Through SDK event hooks:

• onLoad

• onSubmit

• onSuccess

• onFail

• onInvalidForm

Where to Find Your Keys

To initialize any checkout or card-update flow, you need:

🔑 Web SDK Key

A short-lived, auto-generated token used to start the SDK flow.

You can both live and sandbox keys in: Zotlo Dashboard → Developer Tools → Checkout SDK

How the Web SDK Works

1. Your backend generates a Checkout Token using API Keys

2. You pass this token to the SDK in your web application

3. The SDK renders a PCI-compliant payment form

4. User completes the payment → SDK triggers callbacks

5. Zotlo sends webhook events to your server (optional but recommended)

Browser Support

• All modern browsers supported

• Fully responsive mobile & tablet layouts

• Works in single-page apps and server-rendered sites

Security & Compliance

• SDK handles all card data — your servers never touch it

• Fully PCI-DSS compliant

• Secure 3D Secure (3DS) flows handled automatically

• Sensitive fields are encrypted in-browser using Zotlo’s secure payment layer

When to Use Web SDK

Use the SDK if you want:

• Embedded checkout on your own site

• Zero PCI burden

• Fully controlled UI/UX

• Dynamic user-targeted checkout flows

• Card update flows without exposing card info

• Conversion-optimized payment experience

If you prefer redirect flows instead of embedded forms, consider Hosted Checkout instead.

Related Documentation

• About Embedded Checkout

• Checkout Form SDK

• Card Update SDK