docs
  1. SCAYLE Resource Center
  2. Developer Guides
  3. Internationalisation
  4. Localise Checkout

Localise Checkout

General

Users will feel more welcomed by your brand when they can read product descriptions, understand shipping/payment options, and transact in their language of choice. For the localization of end-user communication (e.g., input fields in the address form within your Checkout application), customizations are handled via linked translations to each object, text paragraph, and notification.

Translations are collected and released through the Crowdin platform, then dynamically loaded into Checkout:

Crowdin and Checkout

Localize Content

  1. To begin translations, select a language in your project. \

    Crowdin: select language

  2. The translations file called translations.jsonwill be available in the "Checkout Frontend" folder.\

    Crowdin: translations.json.

  3. The language folders will be set up for each Locale/Language (e.g. “French, Switzerland”, “German, Switzerland”, “German, Austria”, “Dutch”, “Bulgarian”). Translations should be added depending on the applied configurations directly to each relevant string (e.g., if you have a hidden phone number input field, then related translations are not needed).\

    Crowdin: add translations

  4. Click on translations.json in one language folder and a mask opens with strings that you can translate. Choose a string and add the translation.

You cannot create your own translation keys. If you do, they will be deleted again automatically after some time.

If you need keys to reference in the dynamic field config you can use payment.termsAndPrivacy or auth.newsletterSignUp or, if these don't match your use case, you can use one of the keys custom1 to custom10.

If you notice other missing keys like for carriers, shipping options, collection point types or payment options, please report them to the checkout team and they will be added.

Placeholders

Checkout uses ICU Message syntax to manage placeholders. This allows you to express the subtleties of spelling, grammar, and conjugation for each language.

With this format you could build messages like this:

 Welcome back, {salutationCode, select, f {Ms} m {Mr} other {}} {lastName}!

So the system picks up the correct salutation (e.g., Mr./Ms. based on the gender). The example below shows the format {key, plural, matches} where the key is earnings and the # token is used for the numeric value in the output of the match.

Placeholders

Checkout uses ICU Message syntax to manage placeholders. This allows you to express the subtleties of spelling, grammar, and conjugation for each language.

With this format you could build messages like this:

  • auth.returningCustomer.welcomeBack
  • auth.returningCustomer.differentAccount

Release Translations

After you are finished with the translations you need to release the changes.

  1. Enter Content Delivery in the tab Tools:\

    Crowdin: Tools

  2. Then push the Release buttons for Staging and Production environment:\

    Crowdin: Release

After you have released the changes, updates will be dynamically loaded to Staging or Production via Checkout APIs.

There can be a delay of 1-2 hours (approx.) for loading the content.

Translation updates can be done at any time as no specific deployment is needed for that. In case the Crowdin platform is not available, there is a translation fallback mechanism in place. In this case, the latest available data will be used.

You can also refer to the User Manual for details about translation.