Add localization to your Flow integration
Last updated: October 8, 2025
By default, the language displayed on Flow is derived from the locale set in the payment-session
request.
Alternatively, you can use the locale
configuration option to manually set the language in the CheckoutWebComponent
. For example:
1const checkout = await CheckoutWebComponents({2paymentSession,3publicKey,4environment: 'sandbox',5locale: 'en',6});
The following left-to-right (LTR) and right-to-left (RTL) languages are supported:
Language | Code | Language type |
---|---|---|
Arabic |
| RTL |
Chinese (China) |
| LTR |
Chinese (Hong Kong) |
| LTR |
Chinese (Taiwan) |
| LTR |
Danish |
| LTR |
Dutch (Netherlands) |
| LTR |
English (United Kingdom) |
| LTR |
Filipino |
| LTR |
Finnish |
| LTR |
French |
| LTR |
German |
| LTR |
Greek |
| LTR |
Hindi |
| LTR |
Indonesian |
| LTR |
Italian |
| LTR |
Japanese |
| LTR |
Korean |
| LTR |
Malay |
| LTR |
Norwegian Bokmål |
| LTR |
Portuguese |
| LTR |
Spanish |
| LTR |
Swedish |
| LTR |
Thai |
| LTR |
Vietnamese |
| LTR |
You can customize the default text translation for a specific language by providing your own strings.
- Create a
translations
object and specify thelocale
for which you want to provide custom translations. Within the locale object, include the translation keys you want to customize, along with their values. For example:
1const translations = {2en: {3'form.required': 'Please provide this field',4'pay': 'Pay now',5'pay_button.payment_failed': 'Payment failed, please try again',6},7};
- Pass the
translations
object when you create the instance ofCheckoutWebComponents
.
1const checkout = await CheckoutWebComponents({2paymentSession,3publicKey,4environment: 'sandbox',5locale: 'en',6translations,7});
You can customize the following default text:
Translation key | Default text | Description |
---|---|---|
| Bank Account | The label for the bank account option. |
| Cancel | The label for the cancel button. |
| Change | The label for the change button. |
| Continue | The label for the continue button. |
| Loading | Message shown when loading additional information. |
| Card | The label for the the card option. |
| Cardholder name | The label for the cardholder name input. |
| Card number | The label for the the card number input. |
| Your card number is incomplete | Error message shown when the card number is incomplete. |
| {CARD} not supported | Error message shown when the card number comes from an unsupported card scheme. |
| Expiry date | The label for the card expiry date input. |
| Your card's expiry date is in the past | Error message shown when the card expiry date is invalid. |
| MM | Message describing the format for card expiry month input. |
| YY | Message describing the format for card expiry year input. |
| Choose your preferred scheme | The label for the preferred scheme selection. |
| "Your card offers two schemes, and you can select the one you prefer. Otherwise, the default choice applies." | Message prompting the customer to select their preferred scheme. |
| Security code | The label for the the card security code (CVV) input. |
| Your card's security code is incomplete | Error message shown when the security code (CVV) is incomplete. |
| CVV | Message describing the format for card security code input. |
| Save card details for future purchases | The label for the option to store card details for future purchases. |
| Remember this card | The call to action message to remember card details for future use. |
| Phone number not registered | Error message shown when the phone number is not registered. |
| Edit | The label for the edit button. |
| Email address | The label for the email input. |
| Must be a valid email | Error message shown when the customer provides an invalid email. |
| Placeholder message shown in the empty email input field. | |
| Full name | The label for the full name input. |
| Jordan Smith | Placeholder message shown in the empty full name input field. |
| Must be greater than | Error message shown when the customer inputs a value shorter than the required length. |
| Holder first name | The label for the account holder first name input. |
| Jordan | Placeholder message shown in the empty account holder first name input field. |
| Holder last name | The label for the account holder last name input. |
| Smith | Placeholder message shown in the empty account holder last name input field. |
| Must be less than | Error message shown when the customer inputs a value longer than the required length. |
| National ID | The label for the national ID input. |
| National ID is invalid | Error message shown when the national ID is invalid. |
| 30063412345 | Placeholder message shown in the empty national ID input field. |
| Country code | The label for the phone country code input. |
| Phone number | The label for the phone number input. |
| Enter your phone number | The label for the phone number entry. |
| Must be a valid phone number | Error message shown when the phone number is invalid. |
| This field is required | Error message shown when the customer leaves a required field blank. |
| Show Klarna options | The label for the display Klarna options button. |
| Enter your verification code | The label for the verification code entry. |
| Enter the verification code sent to | The call to action message to capture the verification code sent to the customer’s contact details. |
| Enter the verification code sent to your email | The call to action message to capture the verification code sent to the customer’s email |
| Enter the verification code sent via SMS | The call to action message to capture the verification code sent to the customer’s phone via SMS. |
| Enter the verification code sent via WhatsApp | The call to action message to capture the verification code sent to the customer’s phone via WhatsApp. |
| Send code via email | The call to action message to send verification code via email. |
| Incorrect verification code. Try again. | Error message shown when the verification code is invalid. |
| The code has expired. Request a new one. | Error message shown when the verification code expires. |
| Verification code must be | Error message shown when the submitted verification code has an invalid amount of digits. |
| Send code via SMS | The call to action message to send verification code via SMS. |
| We'll send a verification code to | Message shown to confirm the customer’s contact details where the verification code will be sent to. |
| Failed to verify OTP | Error message shown when the customer verification fails. |
| Max resends reached | Error message shown after reaching the maximum resend limit for the verification code. |
| Max retries reached | Error message shown after reaching the maximum number of verification code retries. |
| Resend a code in | Message shown when the customer needs to wait before verification code can be resent. |
| Resend code | The call to action message to resend verification code. |
| Didn’t receive the code? | Message shown to the customer if they want their verification code to be resent. |
| Send to email instead | The call to action message to resend verification code via email. |
| Send to SMS instead | The call to action message to resend verification code via SMS. |
| Send verification email | The call to action message to send verification code via email. |
| Send verification SMS | The call to action message to send verification code via SMS. |
| Sending verification SMS | Message shown when the verification code is being sent via SMS. |
| Confirm | The label for the confirm button. |
| Confirming | Message shown when confirming details. |
| Pay | The call to action shown on the pay button. |
| Payment complete | Message shown when the payment is completed. |
| Payment processing | Message shown while the payment is processing. |
| Pay with | The payment method specific call to action shown on the pay button. |
| After clicking on Pay, you are redirected to finalize your payment | Message shown before the customer is redirected to complete their payment. |
| Approve payment on the | The call to action message to approve payment in the mobile application of the payment method. |
| I have canceled this payment | The label for the button confirming that the customer cancelled the payment. |
| I have approved this payment | The label for the button confirming that the customer approved the payment. |
| Card not supported | Error message shown when the customer provides a card that is not supported. |
| Incorrect details – try again or use another payment method | Error message shown when the customer provides invalid payment details. |
| Try another payment method | Error message shown when the |
| Payment declined – try another payment method | Error message shown when your account is not configured for the payment method you are trying to process. |
| Not enough funds – try another payment method | Error message shown when the customer does not hold sufficient funds to complete the transaction with their chosen payment method. |
| Payment cancelled | Error message shown when the payment is cancelled. |
| Payment expired | Error message shown when the payment request expires. |
| Payment declined – try again or use another payment method | Fallback message shown when the chosen payment method declines the transaction. |
| Payment successful | Message shown when the payment is successful. |
| Something went wrong. Try another payment method. | Error message shown after failing to load the payment method. |
| Creditor | The label for the SEPA Direct Debit creditor name. |
| Creditor ID | The label for the SEPA Direct Debit creditor ID. |
| IBAN | The label for the the International Bank Account Number (IBAN) input. |
| Please enter a valid IBAN. Your IBAN should start with two letters and be 22 characters long | Error message shown when the International Bank Account Number (IBAN) is invalid. |
| AB12 1234 1234 1234 1234 12 | Placeholder message shown in the empty International Bank Account Number (IBAN) input. |
| Saved cards | The label for the stored card options. |
| Use a new card | The label for the use new card option displayed next to stored card options. |
| Loading your saved cards | Message shown when loading stored card options. |
| Other payment methods | The label for other payment method options when stored cards are available. |
| Default | The label for the default option. |
| Expired | The label for an expired option. |
To add support for locales and languages not natively supported by Flow, provide the locale as an object of key-value pairs within the same translations
object you used for custom translations. For example, to add support for US English (en-US
):
1const translations = {2'en-US': {3'pay_button.redirect_cta': 'After clicking on Pay, you will be redirected to finalize your payment',4},5};67const checkout = await CheckoutWebComponents({8paymentSession,9publicKey,10environment: 'sandbox',11locale: 'en-US',12translations,13});
Information
If you are missing a translation for the locale you provide, Flow attempts to fall back to the language of the specified locale. If the locale language is not supported, Flow falls back to en
.