Skip to content

Customized checkout

You have the option to customize the look and feel of your xMoney Checkout page. Here's how:

1. Create your custom payment page

Design your own payment page using HTML and CSS.

2. Use available tags

When building your custom page, you can use the following tags to dynamically display payment information:

Payment Form Tags

Tag NameDescriptionMandatory
{{ error }}Payment form error messages✅ Yes
{{ cardId }}Card selector for choosing a saved card❌ No
{{ cardHolderName }}Cardholder name input field✅ Yes
{{ cardHolderCountry }}Cardholder country selection❌ No
{{ cardHolderState }}Cardholder state/province input❌ No
{{ cardType }} or {{ cardTypeSelect }} or {{ cardTypeImage }}Card type as radio buttons, dropdown list, or image-based dropdown✅ Yes
{{ cardNumber }}Card number input field✅ Yes
{{ cardExpiryDate }}Card expiry date (month and year)✅ Yes
{{ cardCvv }}Card CVV/CVC input field✅ Yes
{{ saveCard }}Checkbox to save the card for future use❌ No

Customer Information Tags

Tag NameDescriptionMandatory
{{ invoiceEmail }}Invoice email address❌ No
{{ firstName }}Customer first name❌ No
{{ lastName }}Customer last name❌ No
{{ country }}Customer country selection❌ No
{{ state }}Customer state/province❌ No
{{ city }}Customer city❌ No
{{ zipCode }}Customer postal/zip code❌ No
{{ address }}Customer address❌ No
{{ phone }}Customer phone number❌ No
{{ email }}Customer email address❌ No

Order & Interface Tags

Tag NameDescriptionMandatory
{{ submit }}Payment form submit button✅ Yes
{{ cart }} or {{ cartLiner }}Cart content, payment description, and total amount✅ Yes
{{ currency }}Order currency code❌ No
{{ description }}Order description text❌ No
{{ amount }}Order amount value❌ No
{{ logo }}Company/merchant logo image❌ No
{{ language }}Language selection dropdown❌ No
{{ closeModal }}Close modal button❌ No
{{ termsAndConditions }}Terms & conditions with clickable link✅ Yes
{{ descriptor }}Site descriptor information✅ Yes
{{ merchant }}Name of the merchant✅ Yes
{{ mandatoryFields }}Description text for mandatory fields❌ No

3. Set a default language

You can set a default language for your payment page by adding the ?lang= GET parameter to the URL.

Example: https://secure.xmoney.com/card?lang=it

Supported Languages

Language CodeLanguageFlag
enEnglish🇺🇸
frFrench🇫🇷
deGerman🇩🇪
roRomanian🇷🇴
esSpanish🇪🇸
itItalian🇮🇹
ruRussian🇷🇺

4. Add custom fields (optional)

To include custom text fields in your payment form, you can use the following format:

Custom Field Syntax

{{ customField({
  'name': 'unique-field-name',
  'label': 'Field Label Text',
  'placeholder': 'Placeholder text for user guidance',
  'error': 'Error message when validation fails',
  'required': true,
  'lang': 'en'
}) }}

Custom Field Parameters

ParameterTypeDescriptionRequired
nameStringUnique identifier for the field✅ Yes
labelStringDisplay label for the field✅ Yes
placeholderStringPlaceholder text shown in the input❌ No
errorStringError message for validation failures❌ No
requiredBooleanWhether the field is mandatory (true/false)❌ No
langStringLanguage code for localization❌ No

Example Custom Fields

<!-- Required field example -->
{{ customField({
  'name': 'company-name',
  'label': 'Company Name',
  'placeholder': 'Enter your company name',
  'error': 'Company name is required',
  'required': true,
  'lang': 'en'
}) }}

<!-- Optional field example -->
{{ customField({
  'name': 'reference-number',
  'label': 'Reference Number',
  'placeholder': 'Optional reference (e.g., PO number)',
  'required': false,
  'lang': 'en'
}) }}
Previous page
Next page
Copyright © xMoney Inc. All rights reserved.