← Back to Home

💳 Popup SDK Demo

Integrate inline popup payment flow into your application

Test Mode Active: Using PayChangu test credentials. No real charges will be made.
Public Key: pub-test-NBoy...gaH | Environment: Test/Sandbox
Test Public Key (read-only in demo mode)

Code Example

// Import the SDK (in a real project with module bundler)
import { PopupSDK, generateTxRef } from 'paychangu-js';

// Configuration object matching the form above
const config = {
    public_key: document.getElementById('publicKey').value,
    tx_ref: generateTxRef(), // Auto-generated unique reference
    amount: parseFloat(document.getElementById('amount').value),
    currency: document.getElementById('currency').value,
    callback_url: document.getElementById('callbackUrl').value,
    return_url: document.getElementById('returnUrl').value,
    customer: {
        email: document.getElementById('customerEmail').value,
        first_name: document.getElementById('firstName').value,
        last_name: document.getElementById('lastName').value
    },
    customization: {
        title: document.getElementById('paymentTitle').value,
        description: document.getElementById('paymentDescription').value
    },
    meta: {
        created_at: new Date().toISOString(),
        demo: true
    }
};

// Initiate the popup payment
PopupSDK.initiate(config);