Localization

The Checkout Web SDK provides out-of-the-box support for the following translations:

Language

shopperLocale

Chinese - Simplified

zh_CN

Chinese - Traditional

zh_TW

Danish (Web SDK 1.3.1 and above) da_DK
Dutch

nl_NL

English - US

en_US

French fr_FR
German

de_DE

Italian

it_IT

Norwegian (Web SDK 1.5.0 and above) no_NO
Polish (Web SDK 1.3.0 and above) pl_PL
Portuguese

pt_BR

Spanish

es_ES

Swedish

sv_SE

The translation that a shopper will see in your Checkout is set with the shopperLocale specified in the payment session. For each translation, you can customize the text displayed on your Checkout.

For shoppers in an unsupported shopperLocale, the default language (English - US) will be used. If you have many of these shoppers in a specific locale, you may wish to create a localization.

Customize localization

To customize the fields shown for a translation, pass a configObject to chckt.checkout. 

Include the Checkout fields that you want to customize, and for each, specify:

  • the shopperLocale - the translation you want to customize.
  • the custom string you want to present to the shopper.

The following example shows how you would customize the "Delivery Address" (deliveryAddress) Checkout field to display:

  • "Shipping Address" to US English shoppers.
  • "Verzendadres" to Dutch shoppers.
var translationObject = {
     "deliveryAddress" : {
          "en_US" : "Shipping Address",
          "nl_NL" : "Verzendadres"
    }
};
 
var sdkConfigObj = {
     translations : translationObject
};

Create localization

To create a localization for a language that is not supported, pass a configObject to chckt.checkout. 

Creating localizations is available from SDK version 1.5.0 and above.

Include any Checkout fields that you want to localize, and for each, specify:

  • the shopperLocale - the localization you want to add.
  • the custom string you want to present to the shopper for this field.

Also include allowAddedLocales as true

The following example shows how you would create a localization for British English (en_GB). This localization would show "County" instead of "State or province".

var translationObject = {
     "stateOrProvince" : {
          "en_GB" : "County"        
    }
};
 
var sdkConfigObj = {
     translations : translationObject,
     allowAddedLocales: true
}; 

Any Checkout fields that you have not specified in your localization will revert to English - US.

Checkout fields

The Checkout fields you can customize, and their default strings, are as follows.

Web SDK versions 1.3.1 and below use a different set of Checkout fields. For a list, see Checkout fields for Web SDK 1.3.1 and below.

Checkout field Default string (en_US)
billingAddress "Billing address"
city "City"
country "Country"
countryCode "Country Code"
creditCard.cvcField.placeholder "123"
creditCard.cvcField.title "CVC / CVV"
creditCard.expiryDateField.invalid "Invalid expiration date"
creditCard.expiryDateField.month "Month"
creditCard.expiryDateField.month.placeholder "MM"
creditCard.expiryDateField.placeholder "MM/YY"
creditCard.expiryDateField.title "Expiry Date"
creditCard.expiryDateField.year "Year"
creditCard.expiryDateField.year.placeholder "YY"
creditCard.holderName.placeholder "J. Smith"
creditCard.numberField.invalid "Invalid card number"
creditCard.numberField.placeholder "1234 5678 9012 3456"
creditCard.numberField.title "Card Number"
creditCard.oneClickVerification.invalidInput.title "Invalid CVC"
creditCard.storeDetailsButton "Remember this card for my next payment"
creditCard.success "Payment Successful"
dateOfBirth "Date of birth"
deliveryAddress "Delivery Address"
error.message.unknown "An unknown error occurred"
error.subtitle.payment "Payment failed"
error.subtitle.redirect "Redirect failed"
error.subtitle.refused "Payment refused"
error.title "Error"
female "Female"
firstName "First name"
gender "Gender"
giropay.details.bic "BIC (Bank Identifier Code)"
giropay.minimumLength "Min. 3 characters"
giropay.noResults "No search results"
giropay.searchField.placeholder "Bankname / BIC / Bankleitzahl"
holderName "Cardholder name"
houseNumberOrName "House number"
idealIssuer.selectField.placeholder "Select your bank"
idealIssuer.selectField.title "Bank"
infix "Prefix"
installments "Number of installments"
lastName "Last name"
male "Male"
mobileNumber "Mobile number"
payButton "Pay"
payment.processing "Your payment is being processed"
payment.redirecting "You will be redirected…"
paymentMethods.moreMethodsButton "More payment methods"
personalDetails "Personal details"
postalCode "Postal code"
sepa.ibanNumber "Account Number (IBAN)"
sepa.ownerName "Holder Name"
sepaDirectDebit.ibanField.invalid "Invalid account number"
sepaDirectDebit.nameField.placeholder "J. Smith"
separateDeliveryAddress "Specify a separate delivery address"
shopperEmail "E-mail address"
socialSecurityNumber "Social security number"
stateOrProvince "State or province"
storeDetails "Save for my next payment"
street "Street"
telephoneNumber "Telephone number"
wechatpay.scanqrcode "Scan the QR code"
wechatpay.timetopay "You have %@ to pay"

Checkout fields for Web SDK 1.3.1 and below

The Checkout fields you can customize, and their default strings, are as follows.

Checkout field Default string (en_US)
paymentMethods.title "Payment Methods"
paymentMethods.storedMethods "Your payment methods"
paymentMethods.otherMethods "Select other method"
paymentMethods.moreMethodsButton "More payment methods"
payButton "Pay"
payButton.formatted "Pay %@"
cancelButton "Cancel"
dismissButton "OK"
storeDetails "Save for my next payment"
payment.redirecting "You will be redirected"
payment.processing "Your payment is being processed"
creditCard.title "Card Details"
creditCard.holderName "Cardholder name"
creditCard.holderName.placeholder "J. Smith"
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 expiration 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.installmentsField "Number of installments"
creditCard.storeDetailsButton "Remember this card for my next payment"
creditCard.oneClickVerification.title "Verify your card"
creditCard.oneClickVerification.message "Please enter the CVC code for %@"
creditCard.oneClickVerification.invalidInput.title "Invalid CVC"
creditCard.oneClickVerification.invalidInput.message "Please enter a valid CVC to continue."
sepaDirectDebit.ibanField.title "Account Number (IBAN)"
sepaDirectDebit.ibanField.placeholder "NL53 ABNA 1925 1294 122"
sepaDirectDebit.ibanField.invalid "Invalid account number"
sepaDirectDebit.nameField.title "Holder Name"
sepaDirectDebit.nameField.placeholder "J. Smith"
sepaDirectDebit.consentButton "I agree that the amount below will be debited from my bank account."
sepa.ownerName "Holder Name"
sepa.ibanNumber "Account Number (IBAN)"
giropay.searchField.placeholder "Bankname / BIC / Bankleitzahl"
giropay.minimumLength "Min. 3 characters"
giropay.noResults "No search results"
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"
error.message.cannotConnectToInternet "Failed to connect to the internet :  please check your internet connection."
error.message.cannotConnectToHost "Failed to connect to our payment server."
error.retryButton "Try again"
idealIssuer.selectField.title "Bank"
idealIssuer.selectField.placeholder "Select your bank"
creditCard.success "Payment Successful"
oneClick.confirmationAlert.title "Confirm %@ payment"
redirect.cannotOpenApp.title "Cannot Open App"
redirect.cannotOpenApp.appNotInstalledMessage "This app could not be opened because it is not installed on this device."
holderName "Cardholder name"
countryCode "Country Code"
telephone.number "Telephone number"