Utilize the Pay.JS Functionality

You are here:

Our Embedded Payment Applet (SimpleCheckout) is utilized through our Pay.JS service layer, which is highly integrateable and which contains several opportunities for you to interact with the Payment process itself.

What is Pay.JS

Pay.JS is our core Javascript File, which contains all relevant and critical information related to serving the front-end of a payment request.

Pay.JS serves the language-layer the HTML-Classes and the Payment Hooks, which gives you the optimal functionality for personalization of the Payment Flow.

Language changes

You can localize each field in the Payment-Form, and personalize the fields to ensure exactly your users understand the wording of the payment fields.

We have gathered a description of how to do this in our article, which can be found here.

HTML-Classes

Pay.JS supports on-the-fly five (5) different themes, which provides the optimal functionality, and at the same time supports the personalization of the form.

You can access each Payment Form Theme by setting the attribute “data-theme” on the payment form, with the class “.paymentWidgets”.

				
					<script src="https://pay.ippeurope.com/pay.js?checkoutId={checkoutId}&cryptogram={cryptogram}"></script>
<form action="#" class="paymentWidgets" data-brands="VISA MASTER" data-theme="divs"></form>
				
			

Divs

Our most commonly used method is our Payment Form served in DIVS. Everything is wrapped nicely in our form and DIV tag. Most commonly when you find a source-code example from us, like above, it will contain our DIV tags as the standard.

We strongly encourage you to use this. 

You can enable our DIV selection functionality by setting the data-theme to divs.

Divs with 3D Seure selection

Our newest DIV‘s with the Payment Fields, can be served with an controlling DIV for which 3D Secure method you wish your users to use (if possible).

Our 3D Secure selection is most commonly used, if you wish to ensure a full 3D Secure Challenge is being performed on each and every transaction. The 3D Secure Challenge is commonly known as a password or an App where the users swipes to confirm the transaction.

You can enable our 3D Secure selection functionality by setting the data-theme to divs3ds.

Supah

Supah was our second direct integrated Payment Form Theme, which can be access as the data-theme supah

Modo

Modo is one of our oldest integrated payment windows, which can be accessed as the data-theme modo

No Data Theme set

Besides the above shown options, you can of cause also choose to use the Payment Window without a preset Theme or selection set around the payment form.

You can enable our raw Payment Form by removing the data-theme attribute from the PaymentWindows class.

Payment Hooks

Each integration is unique, and each integration have several needs before it can confirm a transaction have taken place.

Due to this, we do support several Hooks that can occour as part of the Payment Request.

You can find a full overview under our list of all Payment Hooks.