Localize Text in an Extension

This topic applies to

Applies to

Aconcagua | SuiteCommerce Web Stores

This section describes how to configure and manage localized text in an extension. An extension can include dictionary files with localized text, one file per language. When a user sets a language for a website, the application replaces string literals specified in the extension code with language-specific strings, which appear on the site.

Use the Extensibility API to replace string literals with the localized version in JavaScript files on the frontend and in SuiteScript files on the backend. Use the Handlebars translate custom helper to replace text with the localized version in template files. In addition, the Extensibility API includes a method to add additional translated string literals to the language-specific dictionary files.

translate() Method Syntax

The translate() method has the following syntax:

_('<string {0} {1}>').translate(0, 1)

In the above syntax, string is the string value to translate and 0 and 1 are optional parameters for values within string. Parameter values are optional but you can include an unlimited number, as required.

Custom Handlebars Helper

Use the custom Handlebars translate helper in the template file.

The translate custom helper uses the _.translate() function in HandlebarsExtra.js, which is located in the JavaScript subdirectory of the HandlebarsExtras application module.

To configure and manage localized text in an extension:

  1. Enable your site for localized content and set up the desired languages. For more information, see Set Up NetSuite for Localized Content.

  2. For printing localized strings from JavaScript or SuiteScript files, use the _.translate() method as shown below:

    1. Locate the desired text to translate.

      For example, you want to translate the string Extension in the following code example:

      return Backbone.View.extend({
        template: mine_extension_module_list_tpl
        ,   title: 'Extension'
        ,   events: {
          'click [data-action="remove"]': 'removeModule'
      }
      ...
    2. Use the translate() method for the string Extension:

      return Backbone.View.extend({
        template: mine_extension_module_list_tpl
        ,   title: _('Extension').translate()
        ,   events: {
          'click [data-action="remove"]': 'removeModule'
      }
      ...
    3. To translate the text in a template file, use the translate custom helper.

      For example, a template file contains the following code with the string Task name:

      ...
      <span>
        {{'Task name'}}
      </span>
      ...

      The following code example shows the template file with the translate custom helper:

      ...
      <span>
         {{translate 'Task name'}} 
      </span>
      ...

      Similar to the translate() method, you can use parameters in the translate custom helper. For example:

      {{translate 'There are $(0) apples in the tree' appleCount}}
  3. To add additional localization values in the extension code, use the EnvironmentComponent.setTranslation(locale, keys) method in the Extensibility API.

    The following example shows how to use the setTranslation() method to add translation key values to the es_ES locale:

    environmentComponent.setTranslation('es_ES', [{key: 'Faster than light', value: 'Mas rapido que la luz'}])

    Note

    You can use this method in any JavaScript or SuiteScript file.