Do you want your payment pages to look like the rest of your website without having to host your own payment pages?
If you are using our hosted payment pages to process your transactions you are able to change the layout of the pages so they suit your website when a shopper is making a purchase through your site.
Customised payment pages are a set of files you are able to download from us that will allow you to change the way your hosted payment pages are displayed to your shoppers.
You are able to change the layout of the page, the colour schemes, and images that are on our standard hosted pages.
When accepting transactions through your website you will have a layout, and design that is throughout your website. If you are using our hosted payment pages they will not look like the rest of pages the on your site.
The customised payment pages allow you to change the way your payment page looks to fit with the rest of your site.
You will be able to give your shopper the impression that they will remain on the same pages throughout the transaction process.
By using customised payment pages you will not have to host your own payment pages while still being able to change the way the pages are displayed to your shoppers.
The use of the customised payment pages is restricted to customers who are using our hosted payment pages to process their transactions.
If you are using our payment pages for your transactions you are able to download the files and format your own pages.
customised payment pages can be used by anyone using our form, server, or iframe methods of integration.
I’m using iframe, can I still use the customised payment pages?
Yes, the iframe is still hosted by us and the customised payment page files include the iframe pages you are able to amend.
Once you have downloaded the files you can make the changes to the iframe that will be displayed to your shoppers.
You are also able to use the customised payment pages to work with mobile devices.
Once you have downloaded the customised payment pages and made the changes you want all that is needed is for us to add these to your account.
We will need you to zip up the full customised payment pages file and send this in an e-mail to opayotemplates@elavon.com.
Once we have received this we will add these to your test account for you to ensure the pages look how they should.
If you are happy with the pages we will then add this onto your live account and your shoppers will be able to use your new customised payment pages.
No, using the customised payment pages is completely free when you have an account with us.
When using our systems to process transactions through your account you are able to customise the payment pages on your account.
By using our customised payment pages you will be able to amend the look and feel of your payment pages to feel like the rest of your website.
For more information, check out our customised payment pages article.
When using our systems to process transactions through your account you are able to customise the payment pages on your account.
By using our customised payment pages you will be able to amend the look and feel of your payment pages to feel like the rest of your website.
For more information, check out our customised payment pages article.
To customise your payment pages you don’t need anything from us except the download with all files.
You will need a Java runtime version of 1.4 or higher to run both Saxon and Kernow. If you do not have this version or higher you will be able get these at java.sun.com
Once you have the download and Java you are ready to go!
Now that you have downloaded our payment page files you are ready to customise these.
Included in the download you will find all of these files you can customise.
In the download you will be given all files that you can customise. Not all files can be used at the same time though, if you are using form or server integration the main pages you will customise are:
|
Name |
File name |
Description |
|---|---|---|
|
Card selection |
card_selection.xslt |
is the first Opayo screen that your shopper will see when they are on our system. The shopper will select the card type they are using by selecting an image of the cards available. |
|
Card details |
card_details.xslt |
the card details page is where we capture the details of the card, such as the card number, expiry date, and security code. The card details page also includes pop-up links to static pages in the images folder that you can also amend. |
|
Card confirmation |
card_confirmation.xslt |
your shopper will be shown this page with a summary of the order, and the details they have entered. |
|
Card authentication |
card_authentication.xslt |
This page frames the 3-D Secure page that is shown to your shoppers, if you have 3-D Secure enabled this page will be in your payment process. |
|
Authorisation |
authorisation.xslt |
Is the “authorising please wait” screen your shopper is shown when the transaction is sent to the bank for authorisation. This page is usually only shown for a few seconds. |
|
Errors |
error.xslt |
If your shopper has any problems with their order they will be shown this page. |
|
3-D Secure |
3d_callback.xslt, 3d_redirect.xslt |
These pages won’t really need to be customised, they are used to forward your shopper to and from the 3-D Secure pages and will only ever be shown if your shoppers computer has Java turned off. |
|
3-D Secure |
post_through_browser.xslt |
This page automatically directs your shopper to the 3-D Secure pages and as above will only be shown if your shopper has Java disabled. |
Name
Card selection
File name
card_selection.xslt
Description
is the first Opayo screen that your shopper will see when they are on our system. The shopper will select the card type they are using by selecting an image of the cards available.
Name
Card details
File name
card_details.xslt
Description
the card details page is where we capture the details of the card, such as the card number, expiry date, and security code. The card details page also includes pop-up links to static pages in the images folder that you can also amend.
Name
Card confirmation
File name
card_confirmation.xslt
Description
your shopper will be shown this page with a summary of the order, and the details they have entered.
Name
Card authentication
File name
card_authentication.xslt
Description
This page frames the 3-D Secure page that is shown to your shoppers, if you have 3-D Secure enabled this page will be in your payment process.
Name
Authorisation
File name
authorisation.xslt
Description
Is the “authorising please wait” screen your shopper is shown when the transaction is sent to the bank for authorisation. This page is usually only shown for a few seconds.
Name
Errors
File name
error.xslt
Description
If your shopper has any problems with their order they will be shown this page.
Name
3-D Secure
File name
3d_callback.xslt, 3d_redirect.xslt
Description
These pages won’t really need to be customised, they are used to forward your shopper to and from the 3-D Secure pages and will only ever be shown if your shoppers computer has Java turned off.
Name
3-D Secure
File name
post_through_browser.xslt
Description
This page automatically directs your shopper to the 3-D Secure pages and as above will only be shown if your shopper has Java disabled.
Along with these pages your integration method will depend which other files you will be able to customise.
If you are using our form integration you will also be able to customise:
|
Name |
File name |
Description |
|---|---|---|
|
Error page |
form_response.xslt |
This page will be shown to your shoppers if they get errors with the transactions. This page will re-direct your shopper back to your failure URL on your website. |
|
Shoppers e-mail |
customer_email.xslt |
Is a confirmation e-mail that is sent to your shopper when their payment has been successful. |
|
Your e-mail |
vendor_email.xslt |
We will send you an e-mail whenever a transaction successfully completes. This is sent to your vendor email address. |
Name
Error page
File name
form_response.xslt
Description
This page will be shown to your shoppers if they get errors with the transactions. This page will re-direct your shopper back to your failure URL on your website.
Name
Shoppers e-mail
File name
customer_email.xslt
Description
Is a confirmation e-mail that is sent to your shopper when their payment has been successful.
Name
Your e-mail
File name
vendor_email.xslt
Description
We will send you an e-mail whenever a transaction successfully completes. This is sent to your vendor email address.
If you are using the iframe on your website you are also able to customise the page that is displayed within your own page.
The iframe lets you use our payment pages, but embed them into your own website. Because you are still using our payment pages you will be able to customise the pages of the iframes.
These pages will change the iframe and not your website, the benefit of this is you can customise your iframe to match the layout of your website:
|
Name |
File name |
Description |
|---|---|---|
|
Card details Iframe |
card_details_low.xslt |
A simplified version of the main card details page that asks for the same details except for the card type. |
|
Card authentication |
card_authentication_low.xslt |
Another simplified version of the main authentication page. This page is used to move your shopper from the Iframe to a full screen 3-D Secure page. |
|
Card authorisation |
authorisation_low.xslt |
Is a basic full screen authorising screen that your shopper will see when we send the payment for authorisation. |
Name
Card details Iframe
File name
card_details_low.xslt
Description
A simplified version of the main card details page that asks for the same details except for the card type.
Name
Card authentication
File name
card_authentication_low.xslt
Description
Another simplified version of the main authentication page. This page is used to move your shopper from the Iframe to a full screen 3-D Secure page.
Name
Card authorisation
File name
authorisation_low.xslt
Description
Is a basic full screen authorising screen that your shopper will see when we send the payment for authorisation.
There are 2 other files included in the customised payment page download that although they can be customised we would advise you not to.
They are:
|
Name |
File name |
Description |
|---|---|---|
|
Countries |
countries.xml |
This file is used to build the list of countries that are available for your shopper to select from a drop down box. |
|
US States |
states.xml |
We use this file to create the list of states your shopper can choose if they are a customer based in the United States. |
Name
Countries
File name
countries.xml
Description
This file is used to build the list of countries that are available for your shopper to select from a drop down box.
Name
US States
File name
states.xml
Description
We use this file to create the list of states your shopper can choose if they are a customer based in the United States.
All of our files are able to be used with multiple languages.
Our payment pages use text that is obtained from another file within the download – i18n.xml.
If you would like to use multiple languages on your payment pages you can add more text entries into the i18n.xml file.
Once you are happy with your customised payment pages in English you can create a new string for the other languages you want to add.
By adding <texts xml:lang=”xx”> you will be able to specify when the new language is to be used. The “xx” is the 2 character ISO 639 language reference, for example – fr, French, de, German.
You can then use the same text labels but simply translate the content to the new language you would like to add to the pages.
Along with being able to change the look and feel of each of your payment pages you are also able to change the images that we use.
You can change your own company logo, and the card images we use for the payment pages.
All of the images that are used on the payment pages are stored in the images folder.
The logo we use for your company shares the same name as our vendor name.
For example if your vendor name is sagepaytest your main company logo will be saved at https://{sagePaysystemURL}/images/sagepayest/sagepaytest.gif.
Your logo will be stored on our systems and will be used on both your customised, and standard payment pages so if you need to move back to our standard payment pages your logo will still be displayed and your shoppers will still know who they are buying from.
In the customised payment page download your logo (named yourimages.gif) identifies the location of your real logo.
If you want to change this simply overwrite the logo but leave the filename as yourimages.gif and this will replace the current logo we have stored on your account.
Once you have customised your payment pages you will want to see how they look.
Once you have downloaded the customised payment pages and made the changes you want all that is needed is for us to add these to your account.
We will need you to zip up the full customised payment pages file and send this in an e-mail to opayotemplates@elavon.com.
Once we have received this we will add these to your test account for you to ensure the pages look how they should.
If you are happy with the pages we will then add this onto your live account and your shoppers will be able to use your new customised payment pages.