Customise the Checkout theme

Overview

OnlinePay Checkout API includes the /theme and /image endpoints, which allows you to customise the theme of the payment page to match the look and feel of your website. This includes changing the logo, colours and fonts of the payment page.

The Checkout theme can be customised in the OnlinePay dashboard, or by using the Checkout API. The Checkout API provides a range of options for customising the theme, including:

Font and colour customisation.
Custom logo and background image.
Name and header text.

Customise the Checkout theme using the Checkout API

You can use the Create Theme endpoint to modify the default checkout theme by providing a JSON object with the customisation options.

Colours can be specified using hexadecimal colour codes.

Fonts can be selected from the predefined list of supported fonts:

Roboto
Open Sans
Lato
Montserrat
Slabo
Oswald
Raleway
Source Sans Pro
PT Sans
Lora
Noto Sans and Noto Serif
Nunito Sans
Concert One
Prompt
Work Sans

The following example shows how to customise the theme using the Checkout API:

{
  "config": {
    "is_default": false
  },
  "name": "Pet Store",
  "logo": "{{image}}",
  "entity_id": "{{entityId}}",
  "base_font_family": "Roboto",
  "text_color": "181B25",
  "heading_color": "1F1C4F",
  "background_color": "F3F4F6",
  "panel_background_color": "DEDEE1",
  "primary_color": "DA1710"
}