Paygate forms are framed as standard in white and grey. Merchants can customise the layout of the forms with the help of layout parameters. The simplest way to change the layout is to set the parameters for the background colour (BGColor), background image (BGImage) and the font (FFace). You can use XSL-templates to change the layout further:
In the case of credit card payments you can change the parameter Template to create an individual layout for your PaySSL form which exactly matches the shop layout. To this end your graphic designer can design an HTML-template in the shop-design based on XSLT (Extensible Stylesheet Language Transformation). Computop Helpdesk copies this XSLT-template to our Computop Paygate Server. If you enter the name of your XSLT-file in the Template parameter, the Computop Paygate form will appear in your layout.
For general information about XSLT see www.w3.org.
Please note, that the Corporate Paypage is a fee-based additional service. Please ask Computop Sales thereun.
Computop provides a programming example for creating a responsive credit card form online at https://www.computop.com/de/xslt. The template files to be created – XSL and XML – afterwards are transformed automatically for the various browsers. Please ensure before sending to Computop that both files can be loaded into the browser correctly. The complete code must be able to be displayed and no error message are allowed. If an error message occurs the code and used tags have to be revised. Please note that new versions must be available not later then 3:30 pm in order to to be processed on the same day.
The subsequent conventions apply for the use of the Corporate Paypage with XSLT:
A XSL file designed by you defines your individual layout. The associated XML file contains the texts that are to be displayed on the form. Hence, multilingualism is easy. Always use your MerchantID in the names of the file.
|XML text file
|Sub-folder for images
|Unterordner für Bilder
In order not to receive safety notices, please ensure that external image sources are retrieved via SSL.
In order to call the individual layout, use the ‘template’ parameter with your MerchantID and attach it unencrypted to the call of the Computop payment page, for example: https://www.computop-paygate.com/
Field names of the form
When implementing the text field for the credit card number, use the following values for the parameters ‘name’ and ‘id’:
|Field Name (Name)
|Year of expiry
|Expiry date month
|Credit card number
|Card verification code
A text field for the input of the credit card number is then implemented as follows:
The following hidden fields must be implemented so that the values can be passed on when sending the form:
MerchantId assigned by Computop
|Length of unencrypted (!) data before encryption
|Länge des unverschlüsselten Data-Strings vor der Verschlüsselung
|optional in the case of repeat attempts
|optional bei Wiederholversuchen
|Only with American Express Adress Verification Service
|Nur bei American Express Adress Verification Service
The ‘language’ parameter controls which section of the XML text file is read out. German ‘de’ is always used as standard.
The XML file should have the following basic structure:‘
UTF-8’ is also possible for the encoding.
<xsl:variablename=““ select=“/language/@name”/> you can directly address an XML language section from the XSL file.
For an overview of which parameters are additionally rendered by the PaySSL, please examine the following structure (XSL file is rendered against the following XML string):Since merchants use its own layout for the form, you do not require the layout parameter. However, it is possible after prior consultation with Computop to use the parameters for the transfer, e.g. the SessionID.
In the case of the error codes listed below Computop returns the form in order to enable the credit card data to be entered again. You only have to evaluate the ‘error code’ parameter and display the desired text from your XML file.
At this point the ‘error code’ template is called:
The called-up ‘error code’ template may look like this. It can alternatively be implemented with ‘if’.
It is also possible to integrate the error messages directly into the (main) template:
Link to Visa Secure and MasterCard Secure Code
Visa and MasterCard regulations require that your pay page displays the Visa Secure and SecureCode logo. Please link the Verified logo to https://www.computop-paygate.com/vbv.aspx and the SecureCode logo to https://brand.mastercard.com/brandcenter/mastercard-brand-mark/downloads.html.
Programming and testing the form
First design a HTML page with the layout for your payment page and initially save it for testing with the file extension .htm or .html. Open this file in the browser. Next, save this as an xsl file.
In order to read the texts from the XML file, first of all create your tags in the desired language sections with the texts:
Subsequently, replace the text in the HTML by a reference to the respective section in the XML file:
In order to test your template, we request that you integrate the following lines in your XML file only for the test (before sending it to Computop ) and afterwards to call up the XML file in a browser. If no error is displayed you can send your template and the image folder in a Zip file to Computop Helpdesk with a request to check and install it.
In order to get an overview of the versions, please include the date and version number in the name of your Zip file.
As with the credit card form, it is now also possible to design your own XSLT templates for the SEPA direct debit form. In exactly the same way as with the credit card form, this is controlled via the ‘Template’ parameter. This can be called via the following URL:
The files must use the following naming convention:
|XML text file
|Sub-folder for images
|Unterordner für Bilder
Note: A Corporate Paypage offers you much more extended functions like for example a preconfiguration of card data which are not explained in detail here. For questions about extended functions please consult the Computop Helpdesk.