Lightbox Checkout
The lightbox checkout allows a more seamless experience at the checkout stage. Rather than being redirected to PartPay, it allows the PartPay checkout process to be loaded in a lightbox within the merchant site.
Below is an example of a PartPay being loaded into a lightbox:
Mobile Devices
NB: Mobile devices are not supported for this experience, given the limited screen size, but the lightbox code will detect the device used, and will redirect users who are on a mobile device.
Script
There are 2 options to load the script onto the page, either by adding a <script>
element to their checkout page <head>
, OR dynamically add the script element when the CHECKOUT button has been clicked:
Example <script> head tag
<head>
<script src="https://checkout.partpay.co.nz/assets/sandbox/partpay-sandbox-v1.js"></script>
</head>
Example dynamically loading script:
function appendSandboxScript() {
var el = document.createElement("script");
el.setAttribute("src", "https://checkout.partpay.co.nz/assets/sandbox/partpay-sandbox-v1.js");
document.getElementsByTagName("head")[0].appendChild(el);
}
Use
- Merchant should POST to https://checkout.partpay.co.nz/order as stipulated in the Create Order endpoint, to create an order.
- The response will include the token to be used with the checkout process.
- When the customer clicks the CHECKOUT button activate the PartPay checkout with the
PartPay
javascript object:
Launch lightbox checkout
// CHECKOUT button clicked.
// Initiate the partpay checkout.
PartPay.checkout({
orderToken: token, // <--- token is the returned when creating an order.
success: function () {
// TODO: Handle a successful checkout.
alert("Success");
},
cancel: function () {
// TODO: Handle a cancelled checkout.
alert("Cancelled");
}
});