Pay Station customization

How It Works

You can set up the payment UI appearance by customizing the following parameters:

  • Location on the screen
  • Theme
  • Size
  • Background
  • Preloader

You can set up UI parameters via the token and the widget integration script.

Who Can Use It

Partners who have Pay Station integrated.

How to Get It

To customize the payment UI via the token, change the parameters of the settings.ui object:

ParameterTypeDescription
settings.ui.themestringPayment UI theme. Can be 'default' or 'default_dark'.
settings.ui.sizestringPayment UI size. Can be:
  • small: the least possible size of the payment UI. Use this value when the window size is strictly limited (dimensions: 620 x 630)
  • medium: recommended size. Use this value to display the payment UI in a lightbox (dimensions: 740 x 760)
  • large: the optimal size for displaying the payment UI in a new window or tab (dimensions: 820 x 840)
settings.ui.desktop.header.visible_logobooleanIf 'true', the header will show your logo (please first provide the image to your account manager).
settings.ui.desktop.header.visible_purchasebooleanWhether to show the purchase description (purchase.description.value) in the header. ‘true’ by default.
Note: You can find the full list of parameters in the API Reference.

To customize the widget, change the parameters of the lightbox object:

ParameterTypeDescription
lightbox.widthstringLightbox frame width. If null, depends on Pay Station width. Default is null.
lightbox.heightstringLightbox frame height. If null, depends on Pay Station height. Default is '100%'.
lightbox.zIndexintegerDefines arrangement order. Default is 1000.
lightbox.overlayOpacityintegerOverlay opacity (0 to 1). Default is '.6'.
lightbox.overlayBackgroundstringOverlay background color. Default is '#000000'.
lightbox.contentBackgroundstringFrame background color. Default is '#ffffff'. Please note that these color changes do not affect the Pay Station iframe itself, only the settings of the lightbox that hold it.
lightbox.spinnerstringType of animated loading indicator. Can be 'xsolla' or 'round'. Default is 'xsolla'.
lightbox.spinnerColorstringSpinner color. No default value.
Note: You can find the full list of widget initialization parameters in the API Reference.