This document contains everything you need to know about integrating the klasha payment gateway in your website, and then you can begin to accept payment from anywhere in the world. The following are a few steps to take;

1. Embed klasha JavaScript into the head tag of your HTML code.

JavaScript code to embed:

<script src="https://gate.klasha.com/klasha-integration.js"></script>

See example code below:

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>v </title>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script src="https://gate.klasha.com/klasha-integration.js"></script>

</head>

<body>

</body>

</html>

2. Define a javascript function in your script file

Note: the function and the parameters can be given different names but know what each parameter stands for. It is recommended to name the parameters as their meaning implies as it provides clarity.

function KlashaClient(
merchantKey,
amount,
containerId,
callbackUrl,
countryCode,
sourceCurrency,
kit
) {}

The function accepts some parameters necessary for processing payment, and they include the following:

S/N

Parameters

Meaning

1.

Merchant key

the key generated by the merchant after creating a business in the merchant dashboard. It can be the public or private key.

2.

Amount

the amount that is paid by the customer to the merchant.

3.

Container id

the id of an empty container div in your code.

4.

Callback url

the url your customers are being redirected to after processing payment.

5.

Country code

the country code e.g NGN (Nigeria).

6.

Source currency

the currency set by the merchant in which the price of goods is displayed.

7.

Kit

an array containing the customer’s info as well as the transaction reference.

Example of a container div as stated in (4) in the table above;

<div id="myId">

</div>

Kit explained in (7) in the table above contains the following parameters;

S/N

Parameters

Meaning

1.

Currency

the currency in which payment is made.

2.

Phone number

the customer’s phone number.

3.

Email

the customer’s email address.

4.

Full name

the customer’s full name.

5.

Transaction reference

the transaction reference number. It calls a javascript function makeid(8) where 8 is the length of the id. The length can be any number you desire and an example format is; klasha-8 to 12 digits-datetime (klasha-0123456789-01022021).

6.

Call back

a javascript function that is called after the payment has been made. It can return a successful or failed message depending on the status of the transaction.

Example code for kit

var kit = {
currency:"NGN",
phone_number: "08034403333",
email:"user@gmail.com",
fullname:"yemi desola",
tx_ref: makeid(8),
callBack: callWhenDone
}

The callWhenDone function that is called after payment has been made follows the format shown below

function callWhenDone(data) {
if (data['status'] === "success") {

} else {

}
}
  • Data: this is the information returned, i.e., the response from the server.

  • Status: this indicates the status of the transaction.

Example of data with a failed response

{
"tx_ref": "test-on20047e-291020",
"processor_response": "Invalid Card Type",
"message": "Charge validated",
"status": "failed"
}

Example of data with a successful response

{
"tx_ref": "test-on20047e-291020",
"chargeResponseCode": "00",
"processor_response": null,
"message": "successful",
"status": "successful"
}

That's all you need to integrate Klasha into your website and you can start accepting payment. If you don't have a Klasha account yet, read: "How do I create a Klasha Account?".

Did this answer your question?