Your Checkout can be customized in terms of both appearance and functionality. Personalisation is accessed through your Account Settings and can be observed in real time on the preview.
Tabs that allow to change your checkout are:
Changes made in the settings apply to every payment link and, by default, to every checkout form. However, in the case of checkout forms, it is possible to override these values inline in the embed code. This allows you to have multiple customized forms if needed. To do this, use the data attributes described in Checkout references.
Allows customizing your checkout in terms of logo, fonts and colours.
- Your logo — acceptable formats: jpg, png, gif and svg
- Font — see a full list of supported fonts in the Appendix 1
- Background color — values should be provided as HSV value (eg.
hsv(100,100,100)), RGB values (eg.rgb(255, 99, 71)) or as hexadecimal values (eg.#97DBDC) - Button color — values should be provided as HSV value (eg.
hsv(100,100,100)), RGB values (eg.rgb(255, 99, 71)) or as hexadecimal values (eg.#97DBDC)
Background color can be adjusted only for Checkout generated through Payment Links.
- Header — allows to include
- Your header headline
- Your header caption
- Wallets — enables Apple Pay or Google Pay in your checkout form
- Options — contains a few alternatives that can make your checkout even more personalized
- Show the amount on the 'Pay' button — it is switched on by default
- Require customers to approve your terms and conditions — after ticking this box you'll be able to provide link to your T&C
- Sans Serif
- Lato
- Montserrat
- Nunito Sans (default)
- Open Sans
- Roboto
- Source Sans Pro
- Serif
- Merriweather
- Roboto Slab
- Display
- Oswald
- Arvo
- Monospace
- JetBrains Mono
- Source Code Pro
- Checkout overview -- how Checkout is initialized and configured.
- Using Checkout -- create a Checkout Session and render Checkout in the browser.