Are you looking for test card numbers?

Would you like to contact support?

Default icon

Localizing Components

Learn how to customize the text displayed in a Component, or create your own localization.

If you integrated with our JavaScript Components, you can:

Supported languages

The following languages are supported: 

Language locale
Arabic - International ar
Chinese - Simplified zh-CN
Chinese - Traditional zh-TW
Croatian hr-HR
Czech cs-CZ
Danish da-DK
Dutch nl-NL
English - US en-US
Finnish fi-FI
French fr-FR
German de-DE
Greek el-GR
Hungarian hu-HU
Italian it-IT
Japanese ja-JP
Korean ko-KR
Norwegian no-NO
Polish pl-PL
Portuguese - Brazil pt-BR
Portuguese - Portugal pt-PT
Romanian ro-RO
Russian ru-RU
Slovak sk-SK
Slovenian sl-SI
Spanish es-ES
Swedish sv-SE

Update to the latest Components version if not all of the above languages seem available.

Change language

By default, the Component is presented according to the shopperLocale from your /sessions request. If this language is not supported Drop-in, the Component is presented in US English.

You can also set the Component language by specifying a locale on the AdyenCheckout instance.

Customize localization

The supported localizations can be customized, replacing the default text with the text of your choice. 

 To customize a supported localization:

  • Add a translations object to your payments page with the fields you want to customize. For each specify:

    • locale you want to customize.
    • The fields you want to customize, and the text you want to present for this field.

For example, to customize the English - US (en-US) translation so that your payments form displays:

  • Shipping Address in place of Delivery Address.
  • State in place of State or Province.
const translations = {
  "en-US": {
    "deliveryAddress": "Shipping Address",
    "stateOrProvince": "State"

To use this custom localization in the Components:

Create localization

If your shoppers use a language that isn't supported by the Components, you can create your own localization.

To create a localization:

  • Add a translations object to your payment page, specifying:

    • The localization you want to create. You must use a separator, which can be a hyphen (-) or an underscore (_). For example, use en-GB for English - British.
    • An object containing the fields that are used in the Components, as well as the text you want displayed for each field.

The following example shows how you would create a localization for English - British (en-GB).

const translations = {
    "en-GB": {
        "paymentMethods.moreMethodsButton": "More payment methods",
        "payButton": "Pay",
        "storeDetails": "Save for my next payment",

To use this localization in the Components:


The following are text that can be rendered in the Components. For a full list, refer to our GitHub repository.

    "paymentMethods.moreMethodsButton": "More payment methods",
    "payButton": "Pay",
    "payButton.redirecting": "Redirecting...",
    "storeDetails": "Save for my next payment",
    "payment.redirecting": "You will be redirected…",
    "payment.processing": "Your payment is being processed",
    "creditCard.holderName": "Name on card",
    "creditCard.holderName.placeholder": "J. Smith",
    "creditCard.holderName.invalid": "Invalid cardholder name",
    "creditCard.numberField.title": "Card number",
    "creditCard.numberField.placeholder": "1234 5678 9012 3456",
    "creditCard.numberField.invalid": "Invalid card number",
    "creditCard.expiryDateField.title": "Expiry date",
    "creditCard.expiryDateField.placeholder": "MM/YY",
    "creditCard.expiryDateField.invalid": "Invalid expiry date",
    "creditCard.expiryDateField.month": "Month",
    "creditCard.expiryDateField.month.placeholder": "MM",
    "creditCard.expiryDateField.year.placeholder": "YY",
    "creditCard.expiryDateField.year": "Year",
    "creditCard.cvcField.title": "CVC / CVV",
    "creditCard.cvcField.placeholder": "123",
    "creditCard.storeDetailsButton": "Remember for next time",
    "creditCard.oneClickVerification.invalidInput.title": "Invalid CVC / CVV format",
    "creditCard.cvcField.placeholder.4digits": "4 digits",
    "creditCard.cvcField.placeholder.3digits": "3 digits",
    "installments": "Number of installments",
    "installmentOption": "%{times}x %{partialValue}",
    "sepaDirectDebit.ibanField.invalid": "Invalid account number",
    "sepaDirectDebit.nameField.placeholder": "J. Smith",
    "sepa.ownerName": "Holder Name",
    "sepa.ibanNumber": "Account Number (IBAN)",
    "error.title": "Error",
    "error.subtitle.redirect": "Redirect failed",
    "error.subtitle.payment": "Payment failed",
    "error.subtitle.refused": "Payment refused",
    "error.message.unknown": "An unknown error occurred",
    "idealIssuer.selectField.title": "Bank",
    "idealIssuer.selectField.placeholder": "Select your bank",
    "creditCard.success": "Payment Successful",
    "loading": "Loading…",
    "continue": "Continue",
    "continueTo": "Continue to",
    "wechatpay.timetopay": "You have %@ to pay",
    "wechatpay.scanqrcode": "Scan QR code",
    "personalDetails": "Personal details",
    "companyDetails": "Company details",
    "": "Company name",
    "companyDetails.registrationNumber": "Registration number",
    "socialSecurityNumber": "Social security number",
    "firstName": "First name",
    "infix": "Prefix",
    "lastName": "Last name",
    "mobileNumber": "Mobile number",
    "city": "City",
    "postalCode": "Postal code",
    "countryCode": "Country Code",
    "telephoneNumber": "Telephone number",
    "dateOfBirth": "Date of birth",
    "shopperEmail": "E-mail address",
    "gender": "Gender",
    "male": "Male",
    "female": "Female",
    "billingAddress": "Billing address",
    "street": "Street",
    "stateOrProvince": "State or province",
    "country": "Country",
    "houseNumberOrName": "House number",
    "separateDeliveryAddress": "Specify a separate delivery address",
    "deliveryAddress": "Delivery Address",
    "creditCard.cvcField.title.optional": "CVC / CVV (optional)",
    "issuerList.wallet.placeholder": "Select your wallet",
    "privacyPolicy": "Privacy policy",
    "afterPay.agreement": "I agree with the %@ of AfterPay",
    "paymentConditions": "payment conditions",
    "openApp": "Open the app",
    "voucher.readInstructions": "Read instructions",
    "voucher.introduction": "Thank you for your purchase, please use the following coupon to complete your payment.",
    "voucher.expirationDate": "Expiration Date",
    "voucher.alternativeReference": "Alternative Reference",
    "": "Select your provider",
    "": "Select your bank",
    "voucher.paymentReferenceLabel": "Payment Reference",
    "voucher.surcharge": "Incl. %@ surcharge",
    "voucher.introduction.doku": "Thank you for your purchase, please use the following information to complete your payment.",
    "voucher.shopperName": "Shopper Name",
    "voucher.merchantName": "Merchant",
    "voucher.introduction.econtext": "Thank you for your purchase, please use the following information to complete your payment.",
    "voucher.telephoneNumber": "Phone Number",
    "voucher.shopperReference": "Shopper Reference",
    "voucher.collectionInstitutionNumber": "Collection Institution Number",
    "voucher.econtext.telephoneNumber.invalid": "Telephone number must be 10 or 11 digits long",
    "boletobancario.btnLabel": "Generate Boleto",
    "boleto.sendCopyToEmail": "Send a copy to my email",
    "button.copy": "Copy",
    "": "Download",
    "boleto.socialSecurityNumber": "CPF/CNPJ",
    "creditCard.storedCard.description.ariaLabel": "Stored card ends in %@",
    "voucher.entity": "Entity",
    "donateButton": "Donate",
    "notNowButton": "Not now",
    "thanksForYourSupport": "Thanks for your support!",
    "preauthorizeWith": "Preauthorize with",
    "confirmPreauthorization": "Confirm preauthorization",
    "confirmPurchase": "Confirm purchase",
    "applyGiftcard": "Apply Giftcard",
    "": "Pin",
    "creditCard.encryptedPassword.label": "First 2 digits of card password",
    "creditCard.encryptedPassword.placeholder": "12",
    "creditCard.encryptedPassword.invalid": "Invalid password",
    "creditCard.taxNumber.label": "Cardholder birthdate (YYMMDD) or Corporate registration number (10 digits)",
    "creditCard.taxNumber.labelAlt": "Corporate registration number (10 digits)",
    "creditCard.taxNumber.invalid": "Invalid Cardholder birthdate or Corporate registration number",
    "creditCard.taxNumber.placeholder": "YYMMDD / 0123456789",
    "storedPaymentMethod.disable.button": "Remove",
    "storedPaymentMethod.disable.confirmation": "Remove stored payment method",
    "storedPaymentMethod.disable.confirmButton": "Yes, remove",
    "storedPaymentMethod.disable.cancelButton": "Cancel",
    "ach.bankAccount": "Bank account",
    "ach.accountHolderNameField.title": "Account holder name",
    "ach.accountHolderNameField.placeholder": "J. Smith",
    "ach.accountHolderNameField.invalid": "Invalid account holder name",
    "ach.accountNumberField.title": "Account number",
    "ach.accountNumberField.invalid": "Invalid account number",
    "ach.accountLocationField.title": "ABA routing number",
    "ach.accountLocationField.invalid": "Invalid ABA routing number",
    "select.stateOrProvince": "Select state or province",
    "": "Select country",
    "telephoneNumber.invalid": "Invalid telephone number",
    "qrCodeOrApp": "or",
    "paypal.processingPayment": "Processing payment...",
    "generateQRCode": "Generate QR code",
    "await.waitForConfirmation": "Waiting for confirmation",
    "mbway.confirmPayment": "Confirm your payment on the MB WAY app",
    "shopperEmail.invalid": "Invalid email address",
    "dateOfBirth.format": "DD/MM/YYYY",
    "dateOfBirth.invalid": "You must be at least 18 years old",
    "blik.confirmPayment": "Open your banking app to confirm the payment.",
    "blik.invalid": "Enter 6 numbers",
    "blik.code": "6-digit code",
    "": "Get the code from your banking app.",
    "swish.pendingMessage": "After you scan, the status can be pending for up to 10 minutes. Attempting to pay again within this time may result in multiple charges.",

    //Use these translation fields to configure the aria-label attribute
    //Starting Web Components 4.0.0 this is the only way to configure the aria-label attribute
    "creditCard.encryptedCardNumber.aria.iframeTitle": "Iframe for secured card number",
    "creditCard.encryptedCardNumber.aria.label": "Card number field",
    "creditCard.encryptedExpiryDate.aria.iframeTitle": "Iframe for secured card expiry date",
    "creditCard.encryptedExpiryDate.aria.label": "Expiry date field",
    "creditCard.encryptedExpiryMonth.aria.iframeTitle": "Iframe for secured card expiry month",
    "creditCard.encryptedExpiryMonth.aria.label": "Expiry month field",
    "creditCard.encryptedExpiryYear.aria.iframeTitle": "Iframe for secured card expiry year",
    "creditCard.encryptedExpiryYear.aria.label": "Expiry year field",
    "creditCard.encryptedSecurityCode.aria.iframeTitle": "Iframe for secured card security code",
    "creditCard.encryptedSecurityCode.aria.label": "Security code field",
    "giftcard.encryptedCardNumber.aria.iframeTitle": "Iframe for secured gift card number",
    "giftcard.encryptedCardNumber.aria.label": "Gift card number field",
    "giftcard.encryptedSecurityCode.aria.iframeTitle": "Iframe for secured gift card security code",
    "giftcard.encryptedSecurityCode.aria.label": "Gift card security code field",
    "ach.encryptedBankAccountNumber.aria.iframeTitle": "Iframe for secured bank account number",
    "ach.encryptedBankAccountNumber.aria.label": "Bank account field",
    "ach.encryptedBankLocationId.aria.iframeTitle": "Iframe for secured bank routing number" ,
    "ach.encryptedBankLocationId.aria.label": "Bank routing number field",

    //Card payment error strings for version 3.14 and later  
    "": "Incomplete field",
    "": "Field not valid",
    "": "Invalid card number",
    "": "Typed card number doesn't match card brand",
    "": "Unsupported card entered",
    "": "Card too old",
    "": "Date too far in the future"

Text direction

The default text direction is left-to-right. Text direction is independent from the locale you set in the configuration object. So even if you set the locale to a right-to-left language, like Arabic, you still need to set the text direction.
To change the text direction to right-to-left, use the HTML dir attribute on the parent element for the checkout container. For example, to set the text direction as right-to-left on the body of the page:

Set text direction to right-to-left
<body dir="rtl">

See also