Create customized Payment Window designs
With the Netaxept Template system, you can retain the look and feel of your website throughout the payment process, even though the actual payment window is hosted by Netaxept. You create the templates in your Netaxept portal.
Netaxept portal template system
Templates are created and maintained in your Netaxept admin portal:
Netaxept Admin's Options => Terminal => Terminal design tab
You can have multiple templates stored in your Netaxept admin portal account. You use the Register call’s terminalDesign parameter to refer to a specific template - this allows you to define the desired template on a transaction basis.
The actual template‘s HTML is also entered there, together with special tags that define where the Pay Page is to be placed and where the text and images should appear.
The template system is based on custom tags embedded in normal HTML, with the ability to style templates through inline styling:
tag example
{netaxept:terminal style="color:red" /}
You can customize the formating of your templates through CSS. In Netaxept Admin you can define CSS attributes either by uploading a CSS file or by linking to it from an external source. The latter option requires the file to be accessible from a HTTPS request.
The CSS can be defined either globally, for all templates, or for a specific template. Template-specific styling of course overrides global styling.
For now, mobile template configuration in Netaxept doesn't support CSS.
In addition to the HTML and style attributes, you can change the elements around the Payment Window (such as background color and image) and within the Payment Window (such as background color, text color and terminal border).
The tag showing the actual Netaxept Payment Window is {netaxept:terminal /}. With that, you can freely position the payment window on your website. Please note the extra space between the tag name and the slash (/).
The HTML input follows JavaScript Object Notation (JSON).
Select specific terminal designs per transaction
If you only have one template, this template can be activated in Netaxept Admin. However, if you have several templates (for example seasonal templates or different templates for special transactions), you can specify which template to use per transaction by adding its name to the Register call's terminalDesign parameter.
If the templateDesign parameter is sent, it will overrule any template that has been marked as active in Netaxept Admin and find the correct template from the template names in the list of available templates. If the template cannot be looked up by name from Netaxept Admin, the default template will be used.
Overwrite specific html tags with the "templateData" Parameter
You can dynamically overwrite specific html tags from your stored template with the Register call's templateData parameter .
The templateData parameter expects an array of key/value pairs and contains all the tags and their values that will replace the corresponding HTML tags (and its values) inside the stored template.
This settings are per transaction and will be merged into the active template.
Several tags can be placed within curly brackets and different tags and their values are separated by a colon. If the template contains tags like {keyname /}, the region will be replaced by the value associated with the key keyname.
For example; to set the 2 tags MerchantTime and MerchantTemperature and their values, templateData should be set as follows:
Template data examples
templateData: {"MerchantTime":"13:26:59","MerchantTemperature":"+3C"}.
These two tags also need to be part of the HTML template design in Netaxept Admin portal, as follows:
HTML in Admin portal's Template design section
<p>Time is: {MerchantTime /}. Temprature is: {MerchantTemprature /}.</p> <p>{netaxept:terminal /}</p>
Adding attributes by using meta tags
You can add meta tags which can be used to inform the browser of various additional information. A popular example is the ability to override the character set used in the template, telling the browser how to interpret special characters. Meta tags can be added and maintained directly below the template editor in Netaxept Admin. You have to add the entire meta tag you want to have included.
meta tag example
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
Add images to the payment window
There are two ways for adding images to the payment window.
-
You can use the image upload functionality in Netaxept Admin if your need for images is quite limited (there are some restrictions on the upload). Doing this ensures that the images are delivered through a https-connection, avoiding browser warnings to the end-user about mixed content.
-
You can link to images that are uploaded at a server of your choice. The advantage of this solution is that you are free to choose the format, dimensions and file sizes of the images. The disadvantage is that you are responsible yourself for ensuring the https-delivery.