You have the option to display the payment page in a lightbox on top of your website.
When initiating a payment the Nuvei page will appear in a lightbox. If you send the RedirectInIFrame parameter set to true, the flow to the provider will stay in a lightbox. If you send the RedirectInIFrame parameter set to false, the provider’s page will be displayed on top of the window.
Fill in the form below and click the button to see how it works:
An iframe having 100% width and height of the viewport is generated. You need to perform the following steps:
- Include the following scripts in your HTML page:
Test environment: https://apitest.smart2pay.com/Scripts/Merchant/globalpay.lightbox.1.0.js
Production environment: https://api.smart2pay.com/Scripts/Merchant/globalpay.lightbox.1.0.js
- From your “Pay” button call the JS function renderS2PLightbox (redirectURL, [overlay]) with the RedirectURL received in the response as first parameter. Optionally, you can send a color code or an URL to an image which will be used as background for the overlay mask.
Sample HTML page:
<!DOCTYPE html>
<html>
<head>
<script src="https://apitest.smart2pay.com/Scripts/Merchant/globalpay.lightbox.1.0.js"></script>
</head>
<body>
Your page goes here!
<script>
//render GlobalPay lightbox on your “Pay" button
renderS2PLightbox('https://apitest.smart2pay.com/Home?PaymentToken=03E9B171DCB4D488444A15FB7FE9FD5E.1582339')
//we may specify a color for the overlay mask:
//renderS2PLightbox('https://apitest.smart2pay.com/Home?PaymentToken=51EDD1F455861E7C5372C1E200808DB8.1582340', '#C01234')
//we may specify an URL for the overlay mask background image:
//renderS2PLightbox('https://apitest.smart2pay.com/Home?PaymentToken=9636009264D897B98BE50545F55DB78A.1582343', 'https://apitest.smart2pay.com/Content/images/opacity_black_30.png')
</script>
</body>
</html>