Web payment authorisation UIs

TrueLayer's hosted payment page (HPP) and embedded payment page (EPP) are out-of-the-box UIs that enable your users to authorise payments or mandates in their web browser.

Benefits of web UIs

If you are looking to accept payments or VRPs, it's much easier to integrate using a web UI rather than integrating with the API directly. This is because the HPP and EPP include all the tools you need to accept payments across Europe. This includes all additional inputs such as IBAN and branch name, which are sometimes required from the user, depending on region and banking provider.

We add all feature updates and improvements to the web UIs, and you won't need to change your integration to enable these.

Web SDK

The Web SDK is our latest authorisation UI, optimised for maximum conversion and user experience. To display it, embed a payment button into your checkout screen.

We recommend using this UI for the smoothest integration experience. It grants you access to all new features launched for the Payments API, such as payment retries. The Web SDK supports all our products except VRP and Signup+.

Hosted payment page

The hosted payment page (HPP) is a prebuilt authorisation UI your users access through a link you redirect them to.

The HPP supports the latest Payments API functionality and requires minimal integration. This is because the HPP is a webpage you generate through a URL based on your payment. Learn how to authorise a payment of mandate with the HPP.

You can customise the HPP so that it visually matches your brand. You can also change the language of the authorisation UI and certain parameters related to authorisation and products.

The HPP is compatible with desktop websites, with a hand-off to mobile for user convenience. You can also use it for payment authorisation on mobile devices within a web view.

Learn more about the HPP.

Embedded payment page

The embedded payment page (EPP) is a prebuilt authorisation UI that you can display within an existing website. You can display it as an overlay, or inline as content within your page.

The EPP has all the same functionality as the hosted payment page. Although it requires a little more configuration than the HPP, we recommend it for most integrations. Learn how to authorise payments or mandates with the EPP.

There are variety of ways you can customise the EPP. This includes the visual appearance and colours of the interface and also how it behaves when a user is redirected. You can preview how visual changes look on the EPP Demo page in Console.

The majority of features and elements in the EPP are hosted by TrueLayer and update automatically. However, you may sometimes need to download the latest version of the EPP from NPM, so the EPP offers testing and debugging tools.

Learn more about the EPP.