Overview
Oluwatobi Ololade
Last Update 2 ani în urmă
Our client library allows you to easily embed a payment iframe into your website or application. This iframe provides two payment options (for now): card payment and virtual terminal. The library is designed to simplify the integration process and ensure a secure payment experience for your users.
You can install the client library via the JavaScript client library.
Include the following script in your HTML file:
Important Params
| Params | is required | Description |
| Customer name | Yes | For customizing the name on the invoice that is generated following a transaction requires this. |
| Yes | The email address of the customer is shown to them on the payment library interface. | |
| API key | Yes | It is advised that you utilize the secret key for production/live purposes and the public key for testing purposes. |
| Phone | Yes | When you call the library, you want this phone number to be attached to the transaction |
| Amount | Yes | This is the sum that the transaction is to be made on. |
| Reference | Yes | A unique case-sensitive transaction reference is required for this. Alphabetic letters only (-,., =) are permitted. |
You can display the payment iframe by calling the payWithBelemaPay method. Specify the payment options you want to provide (card payment and virtual terminal):
Ensure you have a button to trigger the payment gateway to respond with the iframe to make payment:
Here's a full example of how to integrate the payment iframe into your html page:
This example will render a payment iframe that supports both card payments and a virtual terminal, providing a seamless payment experience for your users.
- Card Payment:
Users can enter their card details directly in the iframe.
The library securely handles card information and sends it to the payment gateway.
The virtual terminal allows for manual transfer of funds via a generation of virtual account, this virtual account is for a one time transaction and expires after 30 minutes of generation.
This option is ideal for phone orders or in-person payments where customers prefers not to enter the details of their card.
Once a payment has been made, this page has the ability to automatically confirm the payment to be either successful or failed.
The success callback will be triggered when a payment is successfully processed. The paymentData object will contain status.
The onError callback will handle any errors that occur during the payment process, providing feedback to your customer user.
- Ensure the apiKey is kept secure and not exposed to unauthorized users.
- Always use the sandbox environment for testing and production for live transactions.
- Use HTTPS to secure all communication between your application and the payment gateway.
Invalid API Key: Ensure you are using the correct environment's API key (test vs. live).
invalid Card Details: Verify the card details are correct before sending in the payment.
If you have any questions or need further assistance, please reach out to our support team at [email protected].