<script src="http://demo.api.glade.ng/checkout.js"></script>
<form>
  <div>
    Your order is ₦10,600
  </div>
  <button type="button" id="start-payment-button" onclick="makePayment()">Pay Now</button>
</form>
<script>
  function makePayment() {
    initPayment({
    MID:"GP_9695a6071e26433f929b490d7128ecbb",
    KEY: "b0e25a0647ed4276a42fcab6e1897103",
    email: "hello@example.com",
    firstname:"John",
    lastname:"Doe",
    description: "",
    title: "",
    amount: 100,
    country: "NG",
    currency: "NGN",
    onclose: function() {

    },
    callback: function(response) {

    }
});
  }
</script>
body {
  font-family: Sans-Serif;
}

#start-payment-button {
    cursor: pointer;
    position: relative;
    background-color: blueviolet;
    color: #fff;
    max-width: 30%;
    padding: 10px;
    font-weight: 600;
    font-size: 14px;
    border-radius: 10px;
    border: none;
    transition: all .1s ease-in;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.