Docs Inline Checkout (JS)

Inline Checkout (JS)

The easiest way to accept payments on your website. Use our drop-in Javascript library to create a secure checkout popup.

Integration

Note: Always use your pk_test_... or pk_live_... (Public Key) on the frontend. Never expose your Secret Key.

1 Include the Script


                <script src="https://developer.hwebpay.com/js/v1/inline.js"></script>

2 Initialize Payment

function payWithHwebPay() {
  const handler = HwebPay.setup({
    key: 'pk_test_xxxxxxxxxxxxxxxx',
    email: 'customer@email.com',
    amount: 5000, // Amount in kobo
    currency: 'NGN',
    onClose: function() {
      alert('Window closed.');
    },
    callback: function(response) {
      // Payment complete! Reference: response.reference
      alert('Payment complete! Reference: ' + response.reference);
    }
  });

  handler.openIframe();
}

3 Trigger Checkout


                <button onclick="payWithHwebPay()"> Pay Now </button>

Configuration Options

key: Your public API key.
email: Customer's email address.
amount: Transaction amount in kobo.
metadata: (Optional) Object containing extra data.
callback: Function called upon successful payment.
onClose: Function called if the user closes the window.

Subscriptions

Sandbox

Developer Community