Customize payment page

[ { "title":"Testing", "link":"https://docs.solidgate.com/payments/testing/", "text":"Simulate payments to test your integration before launching in production.", "imgSrc":"https://solidgate.com/wp-content/uploads/2022/06/icon-customizable.svg" } , { "title":"Create your payment form", "link":"https://docs.solidgate.com/payments/integrate/payment-form/create-your-payment-form/", "text":"Understand how to integrate the payment form into your product.", "imgSrc":"https://solidgate.com/wp-content/uploads/2022/06/icon-payments.svg" } , { "title":"Billing", "link":"https://docs.solidgate.com/billing/", "text":"Smart billing solutions designed for diverse business models.", "imgSrc":"https://solidgate.com/wp-content/uploads/2022/06/icon-global.svg" } ]

Get in touch
Sign in
Customize payment page
Comprehensive guide for personalizing your payment page

Compared to the Guide
Understand how to integrate the payment form into your product. Payment Form , the Solidgate Payment Page offers fewer customization options but simplifies the process. There is no need for CSS files, as all required parameters are included in the Payment Page API and Payment Link API .

Preview the Payments Page main features and customization options with an interactive demo to explore its adaptable design.
Demo Payment Page

Customize the appearance and content of the payment page using a dedicated object:

  • Public name public_name
    Display the name of your shop on the payment page.
  • Order title order_title
    Names of goods or services you sell are visible to customers on the payment page.
  • Order description order_description
    Description of the order.
  • Payment methods payment_methods
    Additional alternative payment methods.
  • Button font color button_font_color
    Pay button font color by providing a HEX value.
  • Button color button_color
    Pay button color using a HEX value.
  • Font name font_name
    Font name on the payment page.
  • Is cardholder visible is_cardholder_visible
    Display the field cardholder on the payment page.
  • Terms URL terms_url
    URL for the merchant Terms & Conditions will be attached to the checkbox.
  • Back URL back_url
    URL where the customer should be redirected in case of clicks the Back button.

It is important to remember that customers open the payment page on both desktop and mobile devices, and the location of information, in this case, is different.

Merchant name and logo
anchor

Merchants can set the public channel name, ensuring it is up to 15 characters, for full display on the Back to button.

If the channel settings contain this data merchant public name appear on the payment page.

 Channel name example

You can define the channel logo (JPEG, PNG or GIF up to 1024 kb) by contacting support team.

The new logo will be updated within 10 minutes after the request is processed.

Currency values
anchor

The amount and currency of the payment are displayed in two places on the payment page, with the currency sign for popular currencies instead of the ISO currency code.

Actual currency display depends on customer locale and is built on top of (Intl) standard Reference . For example, if your customer needs to pay 100 euros, in Germany, they will see 100 € as the amount and currency, and in the United Kingdom - € 100, meeting the formats natural to their language.

Order information
anchor

Merchant should transmit the order title and description as part of the information sent when requesting the payment page.

If the merchant uses the subscription flow, there is also information about it depending on the scenario:

  • presence or absence of a trial
  • period of charges
 Order information example

Payment fields
anchor

These fields are required to make card payments.

Card payments require the card number, the card expiration date, and the CVV. The form may contain other fields, such as the cardholder’s name, ZIP code, CURP, and others.

 Payment fields example

Wallets
anchor

The Payment Page can display Apple Pay and Google Pay buttons.

The Apple Pay buttons are displayed if the payment page is opened in Safari, provided that the version of Safari being used is either up-to-date or meets the minimum version required to support pay transactions.

 Wallets display example

Alternative payments
anchor

The Payment Page serves as a unified portal that streamlines the process of online transactions by offering multiple payment methods without the need for separate integrations.

Supported payment methods, which are available according to customer locale, include:

 APMs example

Our payment methods are tailored to customer locales, offering region-specific options for a familiar and seamless checkout experience. Here is a breakdown of the payment methods and their availability by country code:

Alternative methods Currency code Country code
iDEAL EUR NLD
Blik PLN POL
MB WAY EUR PRT
SEPA EUR AUT , BEL , BGR , HRV , CYP , CZE , DNK , EST , FIN , FRA , DEU , GRC , HUN , IRL , ITA , LVA , LTU , LUX , MLT , NLD , POL , PRT , ROU , SVK , SVN , ESP , SWE , GBR

Terms and conditions
anchor

There is an option to add a link to your policies, the link is attached to the checkbox.

If the terms and conditions are not set up, the payment page does not contain the block about them.

To meet legal and operational website requirements, consider including your terms and conditions in the payment page.

 Terms and conditions example

Legal information
anchor

In a subscription flow, it is necessary to inform the customer that clicking the payment button implies agreement to the subscription. Legal information example
Example
By confirming your subscription, you allow merchant name to charge your card for this payment and future payments in accordance with their terms.

Back URL
anchor

The Back URL is essential for improving the customer experience during online payment processes, as it allows customers to return to the merchant’s site from both the payment page and the status page after payment. Back URL example

The typical order of actions is:

  1. Open the merchant site.
  2. Choose an item for purchase.
  3. Go to the payment page.
  4. Click on the Back button or link to return to the merchant site.

Also, note the maximum limit of 15 characters for Back to {{merchant name}}.

If the merchant name exceeds 15 characters, it is displayed as Back to website.
Looking for help? Contact us
Stay informed with Changelog