Getting Started
To begin using Klump as your preferred By Now, Pay Later solution, you must first create an account. Simply register as a merchant via the merchant dashboard. When you're finished, log into your account, go to the settings page, check the API & Webhook tabs, and copy your Klump public key. We'll be needing it soon.
To begin integrating Klump as a merchant, simply place the klump.js script in the header section of your website. When you finish this process, you'll be halfway there.
Klump Checkout Widget
The checkout widget is where the transaction happens. The widget is ONLY activated when a user clicks on the Checkout button. Installing the button via <div id="klump__checkout"></div> isn't the end of the road — we need to attach an event handler to it and also pass the product/item information to an instance of Klump.
Sample code initialization for the Klump checkout button that triggers the Klump checkout widget.
From the code above, the Public Key(publicKey) required is the Klump merchant's public key that we mentioned above. You will need it here. The data object carries some important information like amount which is the total transaction amount.
The next item in the data object is the shipping fee(shipping_fee) optional. The shipping fee here is optional as not all merchants will need to ship their products or services.
Currency(currency) required is the next item in the data object. Today, all currency must be set to NGN given that Klump is only operational in Nigeria.
From the data object above, first_name, last_name, email, phone are all optional fields.
Redirect URL(redirect_url) This isn't required but can come in handy for merchants who want to show their customers a custom message or a confirmation page after a successful transaction.
Merchant Transaction reference(merchant_reference) isn't a strictly required field, Klump allows a merchant to send their own reference. This is mostly for the merchant's internal use.
Metadata(meta_data) - This is another field that isn't required, but merchants can use it to store personal information relating to an order.
Items(items) required is the next key in the data object. It must be set as an array and should have the following required keys unit_price, quantity and name. Unit price(unit_price) must always be an integer. Image URL(image_url) and item link(item_link) are nice to have as they provide a visual cue as to what was purchased and an easy path to viewing the said item. You can add as many products as necessary to the items array.
Transaction Amount.
The amount here must be equal to the sum of the items in the items array plus the optional shipping fee(shipping_fee). In the example code above, the amount is derived using the formula below
Please note that if the amount provided doesn't match the sum of unit price, quantity and the optional shipping fee, the transaction wouldn't be accepted.
PS: amount and shipping_fee must be integers.
At the end of every successful transaction, it's advisable that you verify the transaction before giving value. You can verify a transaction using the transaction Transaction verification endpoint or via webhooks.