[
{
"title":"Access to API",
"link":"https://docs.solidgate.com/payments/integrate/access-to-api/",
"text":"Understand how Solidgate authenticates your API requests and provides validation errors.",
"imgSrc":"https://solidgate.com/wp-content/uploads/2022/08/One-time.svg"
}
,
{
"title":"Integrate",
"link":"https://docs.solidgate.com/payments/integrate",
"text":"Explore Solidgate integration options, payment methods, and merchant website integration methods.",
"imgSrc":"https://solidgate.com/wp-content/uploads/2022/08/Custom-Built-Rules.svg"
}
,
{
"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/07/integration.svg"
}
]
Create a seamless experience for customers by styling your payment form
The payment form offers exceptional flexibility and extensive customization options, accommodating various requirements for payment processing in different countries. It supports displaying additional fields necessary for processing transactions and allows white-listing fields for easy display control, ensuring a tailored user experience regardless of the location.
Through the form, there is an opportunity to:
use one of the payment form templates
define styles for the selected form template or leave the default option
restrict the
Guide
After completing all the steps described above and modifying all required parameters, you need to initiate Solidgate SDK.
optional field
from being shown
Template
Solidgate offers a number of default form templates with ready-to-go styles if you do not want to customize it with your owns.
Using a template for a payment form provided by Solidgate can simplify the process of accepting payments on your website. Templates provide a pre-designed and functional form that you can use without the need to customize its appearance or layout. This can save time and effort and ensure that the form adheres to industry standards for security and user experience.
Styles
The Solidgate payment form is styled with a styles object composed of nested CSS properties under objects corresponding to various form elements. This provides a simple and flexible way to modify the appearance of the form without having to make changes to the underlying HTML or JavaScript code.
Allowed Classes
Description
styles
The class enables customization of all input fields’ CSS properties on the form, ensuring a consistent design that aligns with your website’s aesthetics.
The CSS properties are supported in the following classes:
Form styles properties
Expand all
Description
Class for editing styles of all input fields on the form.
Description
Class for editing styles of all additional fields on the form.
Description
Parameter responsible for the body of the form.
Description
Card number field parameter.
Description
Expiry date field parameter.
Description
Card CVV field parameter.
Description
Cardholder parameter field.
Description
ZIP code field parameter.
Description
Submit button field parameter.
Description
The payment form title - header for the payment form.
Description
The payment form subtitle.
Description
Class for editing card template. Sample for changing card color: card_view: { 'background': '#3D4251'}
Description
The errors customization for card and flat template.
Description
Class for editing the size and position of card brands.
Description
Class for editing the size and position of secure brands.
Description
Wrapper for CVV and Expiry Date fields in default form template.
To get the value of fieldNameLabel for additional fields, you need to take the Field Class name on the table, remake it into camelcase, and add a label at the end.
For example, bolivia_ci becomes boliviaCiLabel, and argentina_dni becomes argentinaDniLabel.