Gladepay Blog.

Get updates about what is happening in our company, our products and services.

SETUP ONLINE PAYMENTS IN LESS THAN 2 MINUTES USING GLADEPAY CHECKOUT.

Online payments have increasingly become the most preferred method of making payments across Africa.

While Senior Web Developer can leverage on payment platforms to provide seamless experiences for their clients or customers on their websites or applications, it is extremely difficult for Junior Developers or people with no programming knowledge/skill like myself to accept payments online🙈.

At GladePay, one of our goals is to provide an easy way for businesses to pay, get paid, grow with you and support your business to grow globally😋. Today we are excited to take you closer towards making that a reality.

In our effort to ease payments for business, we’re excited today to introduce GladePay Checkout Snippet.
Which one is GladePay Checkout Snippet again huh?🤔 Well, it is a small portion of code (to copy and paste on your website) for you to securely accept payment online. It is as simple as including a button with necessary options/attributes to suit your needs.

Oookkkaaayy🤥, how do this works? Let me walk you through the process with a real-life example.
Charles works as a Junior Web Developer for an N.G.O at Lagos Nigeria, he had designed an amazing website for this organization and he needs to put a ‘Donate Now’ button on the website for people to donate to their cause.

Just like me, Charles couldn’t get his head wrapped around all these technical jargons yet😔, like APIs or how to connect to them🤷‍♂, JSON implementation or how to work with it😟. Sounds strange right? Okay, let’s see how GladePay Secure Checkout Snippet solves the issue.

You can follow along on your laptop, tablet or phone.

Well, the first thing to do is visit https://gladepay.com/signup to create an account or visit https://gladepay.com/login if you have an account already. Charles would be creating a business account for his organization on GladePay.

Now that’s done, you would see a pop-up with a prompt to enter your business name, be sure to put the right information.

Well, let’s get to it. Let’s go and copy the snippets/codes by clicking on the ‘documentation’ link on the footer on your GladePay Dashboard or visit https://dashboard.gladepay.com/documentation.

A page will be displayed to Charles that looks like the image below.

Charles would copy the script and paste it in-between the head  section of his website source code.
For Example

<html>
    <head>
       <title>Donate Now Page</title>
        <!-- GladePay Checkout Script -->
	<script type="text/javascript" src="https://api.gladepay.com/checkout.js"></script>
    </head>
    <body>
       ...
    </body>
</html>

The next thing for Charles to do is to copy the next code that looks that the one shown below and paste it on any part of his website in the body tag.

<body>
....
  <a 	class="initpayment"
	data-MID="GP0000001" 
	data-amount="1000" 
	data-currency="NGN" 
	data-pay_button_text="Donate Now" 
	data-pay_button_color="#00AFEF" 
	data-country="NG" 
	data-title="Orphan Donations">
  </a>
....
</body>

Note that the ‘GP0000001’ is Charles’ MID (Merchant ID), it won’t work for you or any other account🤨. Your own Merchant ID is already generated inside the code. or visit https://dashboard.gladepay.com/settings/api-keys to copy your Merchant ID.

Feel free to change any other option value to suit your needs except that 'initpayment' must always be the class of the button because it is needed for the checkout to work, don’t say I didn’t tell you o. See table below for more information.

Alright, now that every bolt is tied, it’s time for Charles to refresh his webpage, go ahead and reload your webpage.
A button like an image shown below should be displayed.

Click on the button and Voila😲😂😃!!!

Yeah, I know, it’s simple and straightforward, Charles felt the same way too. Just like that, you are set to start receiving instant and secure payments 💰 from all over the world. Isn’t God a wonderful God🤗?

(Also: I don’t like to gossip… but I heard some insider gist that even Senior Developers use this snippet to speed up things 🤫) and they will be forming god-level to us.
Because whenever a payment is completed a callback function called with the response and a onclose function is called when the close(x) button is clicked on.

// The script below is optional.
<script>
function callback(response){
  ...
}
function onclose(){
 ....
}
</script>

At this point, I should let you know that GladePay can help you accept payments using Credit/Debit Cards, Banks, USSD, Phone Number, QR Pay & Mobile Money depending on the payment methods you want to be enabled on the checkout😉.
Choose the payment methods here. https://dashboard.gladepay.com/settings/payment/preference

Running into Issues with the Code Snippet?

Don’t worry, we know it’s not your fault🙄. GladePay Technical Product Specialists will work with you at every step of the way until you’re able to start accepting real payments from customers.
Feel free to chat us on 🌐 https://www.gladepay.com.
You can also call us 🤙 on +234 817 557 4227
or mail us at 📬 hello@gladepay.com

1 comment

Comments are closed.