Back to home
INTEGRATION
PAYMENT FEATURES
AFTER PAYMENT
Simple Checkout
SeerBit Simple Checkout is an inline, responsive payment form that works seamlessly across all devices. It supports the full range of payment methods available through our standard checkout integration and is fully PCI-compliant. For details on supported payment methods, visit our Payment Methods Overview.
How it Works
Simple Checkout allows you to embed a payment form directly on your webpage using the SeerbitPay() JavaScript function. This function processes transactions based on your configuration. If you include a redirect_url in your request, users will be redirected to that URL upon successful payment.
Parameter Description
Name
Type
Description
Required?
public Key
string
public key - this can be copied from the seerbit dashboard
Yes
currency
string
Payment Currency
Yes
tranref
string
Transaction Reference
Yes
amount
string
Amount to be paid
Yes
description
string
Decription of the transaction
Yes
Name
Type
Description
Required?
public_key
string
Your SeerBit public key, used for secure transactions. Obtain it from the Merchant Dashboard.
Yes
currency
string
The transaction currency (e.g., NGN, USD).
Yes
tranref
string
Unique transaction reference.
Yes
amount
string
Amount to be charged.
Yes
description
string
Decription of the transaction
Yes
full name
string
Customer’s full name (first and last name separated by a space).
Yes
Before you begin
- Login to your SeerBit Dashboard.
- Navigate to Settings > API Keys
- Copy your Public Key
Integration Steps
1.Adding the Seerbit.js script to your page
Include the SeerBit JavaScript library in your <head> section and the paywithSeerbit() function in your page body:
1<html>
2 <head>
3 <title>SeerBit Simple Checkout</title>
4 <script src="https://checkout.seerbitapi.com/api/v2/seerbit.js"></script>
5 </head>
6 <body>
7 <button onclick="paywithSeerbit()">Pay Now</button>
8 </body>
9</html>2. Configure the Checkout
Add a payment button and configure the SeerbitPay() function with your transaction details:
1<html>
2 <head>
3 <title>SeerBit Simple Checkout</title>
4 <script src="https://checkout.seerbitapi.com/api/v2/seerbit.js"></script>
5 </head>
6 <body>
7 <button onclick="paywithSeerbit()">Pay Now</button>
8
9 <script type ="text/javascript">
10 function paywithSeerbit() {
11 SeerbitPay ({
12 "public_key": "sbpub_yywuuuywyyttwttwy", //replace with your public key
13 "tranref": new Date().getTime(), // payment reference
14 "currency": "NGN",
15 "country": "NG",
16 "amount": "150.00",
17 "email": "test@emaildomain.com",
18 "mobile_no": "", // Mobile Number
19 "productId": "", // Product ID
20 "description": "", // Product Description
21 "setAmountByCustomer": false, //optional field. Set to true to allow customer set the amount
22 "full_name": "John Doe", // Mandatory. (system expects two strings, demarcated by a space)
23 "tokenize" : false, // set to true to allow token capture
24 "planId" : "", // subcription plan id.
25 "pocketReference" : "", // pocket reference number.
26 "splitCode" : "", // Split Rule Code.
27 "callbackurl": "http://yourdomain.com",
28 },
29 function callback(response, closeModal) {
30 console.log(response) //response of transaction
31 },
32 function close(close) {
33 console.log(close) //transaction close
34 })
35 }
36 </script>
37
38 </body>
39</html>
40Optional Configuration
Adding this will automatically inlcude all the features and payment methods the seerbit checkout has. Including our advanced fraud detection tools whenever your customers attempts to make a payment
1"decription": "test payment description",
2"splitCode": "100001", // enter your split code if you will using the split settlement featureDynamic Split Payment
Testing your integrationDynamic split Payment allows you to share a single transaction with multiple accounts. You can either create the split in advance using Split Rule on the Dashboard and reference it with a
splitCode, or define the split dynamically at the time of the transaction.
1"split": {
2 "type": "FLAT", // PERCENTAGE
3 "transactionFee": "SUB_ACCOUNT", // ALL_ACCOUNTS, PROPORTIONATE, SUB_ACCOUNT, PARENT_ACCOUNT
4 "items": [
5 {
6 "subAccountCode": "imshia-uba-programme-Qx7aL9",
7 "subAccountName": "",
8 "value": "3.01"
9 },
10 {
11 "subAccountCode": "ops-costs-2sD4kA",
12 "subAccountName": "",
13 "value": "2.00"
14 }
15 ]
16 }
17}Optional Customization
You can tailor the checkout experience to match your brand.
1customization: {
2 theme: {
3 border_color: "000000",
4 background_color: "F8F8F8",
5 button_color: "2E6EEB",
6 },
7 // Choose which payment methods to display
8 payment_method: ["card", "account", "transfer", "wallet", "ussd"],
9 confetti: true, // Show a fun celebration on successful payment
10 logo: "https://yourlogo.url/logo.png", // Your brand logo
11}
12Testing & Payment Verification
Click your Pay Now button and use our test cards to simulate transactions. No real funds will be debited.
Card Type
Card Number
Expiry Date
CVV
Mastercard
5123450000000008
05/21
100
Verve Card
6280511000000095
12/26
123
To learn how to verify payments, visit our Payment Verification Guide.
Troubleshooting
Card Type
Card Number
Expiry Date
CVV
Mastercard
5123450000000008
05/21
100
Verve Card
6280511000000095
12/26
123
If the payment modal does not appear, check your browser console for errors (commonly a missing public_key). For full parameter details, visit the Simple Checkout API Reference.
Need something else?
If you have any questions or need general help, visit our support page
Signup for developer update
You can unsubscribe at any time. Read our privacy policy.