Developers / Experience Cloud

Salesforce Translation and Localization: Setting Up LWC and Surveys

By Martina Burjanová

I have implemented Experience Cloud pages in combination with Salesforce Feedback Management (surveys) for the US market. This solution should be introduced in other countries in different languages and my task was to localize the web pages and surveys, as both these components are translated in another way.

No one enjoys repetitive tasks and complicated maintenance and I aimed to set it up in a way that is easily maintainable and customizable. 

Used Languages

The solution needed to be localized in these languages:

  • American English (en_US), German (de) are both fully supported languages;  this language can be selected for all features, including Help.
  • Canadian French (fr_CA), Canadian English (en_CA) are both platform-only languages. This means that Salesforce does not provide any translation for these languages but it is recognized, and Salesforce will switch to these languages. All translations are custom.

Switching Languages in Experience Cloud

The solution consists of LWC that show content dynamically based on the language URL parameter. This is how Salesforce switches between languages. I added another parameter, country, which was necessary for backend processing.  

Here are examples of what such URLs look like.

Germany:

“https://my-org.my.site.com/surveysite/s/my-survey?language=de&country=GER”

Canada:

“https://my-org.my.site.com/surveysite/s/my-survey?language=en_CA&country=CAN”

“https://my-org.my.site.com/surveysite/s/my-survey?language=fr_CA&country=CAN”

Switching Languages of Surveys

A URL parameter is used for switching languages of surveys too. It is the parameter guestUserLang that needs to be used in the survey invitation link. However, the parameters do not always use the same language abbreviations as Experience Cloud. See the table below for details.

Language ParameterLanguageguestUserLang
Canadian Englishen_CANen-CA
Canadian Frenchfr_CAfr-CA
Germanydede
USAen_USen

Experience Cloud Pages Localization

LWC are completely custom solutions but Salesforce helps with switching the languages. Here is how to set it up.

  1. Enable selected languages in Experience Builder.
  1. Use Custom Labels in Setup. There will probably be a lot of custom labels already, so it is useful to use Categories when inserting new custom labels so the labels stay organized.

One custom label looks like this. A translation in another language can be added here.

The custom labels are used for:

  • Simple labels – to be inserted in HTML tags
  • HTML code with words in – for more complicated content like menu items

This is how it is imported and used in the JavaScript of LWC

Simple usage of the custom label:

Example of the usage of the custom label for replacing a block of HTML, it needs to be enclosed in the lightning-formatted-rich-text tag:

This code block replaces this HTML:

However, in this case, it is necessary to escape characters that could be wrongfully interpreted as markup. Escape HTML characters for instance with this online tool:

READ MORE: Free Online HTML Escape / Unescape Tool – FreeFormatter.com

Then the content of the custom label looks like the text below and it will be correctly interpreted as HTML when inserted as a value in the lightning-formatted-rich-text tag.

Feedback Management: Surveys

Translation of surveys is a Salesforce functionality that requires some configuration changes to make the translation user-friendly.

  1. Enable Translation Workbench in Setup → Translation Workbench → Translation Language Settings
  1. Enable Platform-only languages in Setup → Company Settings → Language Settings. Choose the languages that you need.
  1. Activate the languages you need in Translation Workbench and choose the user who will translate it.
  1. Open a survey in Salesforce UI and there will be the languages you activated:
  1. When you click on Translate, you will be able to fill in translations of all text that appears in the survey. The latest version of the survey always needs to be activated otherwise the translation of the survey will not be available. 
  1. When you need to send the translation to another org with a change set you find the survey under Flow definition. 

How to Switch the Language of the Survey 

Use the parameter guestUserLang in the invitation link for the survey. Here’s an example of a survey invitation link:

 “https://my-org.sandbox.my.site.com /surveysite/survey/runtimeApp.app?invitationId=0KiFS77777775J3&surveyName=blog_survey&UUID=aaa-ddd-dddd&guestUserLang=fr-CA”

The GuestUserLang parameters might be different than the SF language character. If you do not know the correct abbreviation or if the survey does not open in the correct language, then erase the GuestUserLang from the survey invitation link and you will see the menu from which you should choose the survey language. After you choose the language, the survey will open in the correct language and the correct GuestUserLang will be in the URL where you can read it.

Deployment With Change Sets

Survey: when you need to send the translation to another Org with a change set you find the survey under Flow definition, there are no category surveys in the change set menu. 

Custom label: the category custom label is available in the change set menu. However, when you need translations, you also need to add the Language Translation to the change set or the translation will not be transferred.

Does the Translation Influence the Backend?

The survey responses are processed by collecting answers from the SurveyQuestionResponse records. The questions and the responses are in English and the translation does not play any role in the backend.

Summary

Localization of the custom web in Salesforce is possible but it can be tricky – several configuration items need to be enabled. Translation of surveys is quite easy and user-friendly but the localization of LWC requires smart usage of custom labels. 

The Author

Martina Burjanová

Martina is a Salesforce Full Stack Developer at Merkle DACH

Leave a Reply