Rebranding Paypoint payment pages – gotchas

One of my clients is using Paypoint (AKA SECPay) as the payment gateway for their online store. Their documentation on integrating the shopping basket part of the site with Paypoint is not too bad, but I came unstuck when trying to rebrand the gateway pages to look like the main website.

Before starting – I believe you need to be a ‘Gateway Freedom’ customer to be able to rebrand the page that takes the credit card details on Paypoint.

If you’re a Gateway Freedom customer, you can follow the Gateway Hosted PDF from theirĀ  integration guides page, then make some changes based on the Gateway Freedom PDF, downloadable from the same page.

Part of the Gateway Freedom guide says you make a branded page, they give you a template to save and amend to your design, then upload it in to your Paypoint account and reference it in a hidden variable of the form you send to Paypoint with the various customer and product details. Unfortunately, I couldn’t find the File Manager talked about in any part of my client’s account, either where the documentation says it is or anywhere else.

The thing you actually have to do is make the rebranded template, save it on your site, then reference that in the hidden field. Paypoint then pull that off your server, replace all their placeholder tags with relevant information (i.e. the credit card field labels), and display it to the customer.

The hidden HTML field is ‘template’, so you add to the other hidden fields you send through to them something like this:

<input type=”hidden” name=”template” value=”http://www.yoursite.com/your-rebranded-page.html”>

When you rebrand a page in this way, you need to make sure all references to images are absolute – so they have the whole path to them including the domain. Potentially you’ll need an SSL certificate on your site so you can reference them through https rather than http. This means you won’t get a mixed secure/non-secure warning on the credit card page. If you don’t have an SSL certificate, test that first as my client already had one so I just used it.

Also, if you copy the Paypoint template, the images don’t have absolute URLs and didn’t work for me, I had to put https://www.secpay.com/starter/ in front of them – so small_logo.gif became https://www.secpay.com/starter/small_logo.gif

All rather frustrating, but once you know how it works, it’s easy to set up. I also discovered if you need to amend the HTML when you’re testing, you can just upload a change to your server and refresh the page you’re seeing on Paypoint/SECPay, no need to back out and re-submit your form, which I’ve had with some other payment gateways. That makes testing how changes look very easy.

If you’re doing a Paypoint/SECPay integration – good luck!

Leave a Reply

Your email address will not be published. Required fields are marked *