UI Plugin Localization

Statically compiled resource bundles are used to provide translations for much of Hippo’s CMS UI and plugins. Examples are:

• Translations for the configuration of custom HST component and Channel information
• Translations for the configuration of custom Targeting collectors

Statically compiled resource bundles are one source for providing translations for the CMS UI. For more details, see CMS UI localization.

Compile time translations come in two flavours:

• Java property files which are used by Wicket and ExtJS code
• JSON files used by AngularJS code in combination with Angular Translate

For an explanation on using Java property files in Wicket code, see the section “Using Java resource bundles in Wicket” below.

For an example how ExtJS code uses the Java property files for translation labels, see the example GroupsCollectionPlugin collector (TODO http://www.onehippo.org/library/enterprise/enterprise-features/targeting/collectors.html). In general, ExtJS can components have their translation labels pushed into them through the WicketExtJS bridge.

Bloomreach Experience Manager also uses AngularJS code for more and more pieces of functionality. The Angular JS code uses Angular Translate to pull in translations which are stored in separate JSON files. For an example, see translations JSON file for the Channel Manager at https://code.onehippo.org/cms-community/hippo-addon-channel-manager/tree/hippo-addon-channel-manager-5.2.0/frontend-ng/src/i18n.

Using Java resource bundles in Wicket

In Wicket you use a combination of a Java class file and an HTML file of the same name. For localization one can also add .properties files. In Bloomreach Experience Manager these files all have an underscore and a language code at the end of the filename, except for the default language. For example:

addon/cms/dashboard/src/main/java/org/hippoecm/frontend/plugins/cms/dashboard
   DashboardPerspective.java
   DashboardPerspective.html
   DashboardPerspective.properties
   DashboardPerspective_nl.properties

In Bloomreach Experience Manager, there can be .properties files and HTML files of the same name in the classes folder of the WAR, which take priority over those located in the jars inside the WAR. For instance, the DashboardPerspective plugin includes the following files:

WEB-INF/default/org/hippoecm/frontend/plugins/cms/dashboard
   DashboardPerspective.html
   DashboardPerspective.properties
   DashboardPerspective_nl.properties

In the html file, you can define Wicket messages. For example a message with key 'todo':

<wicket:message key="todo">todo message</wicket:message>

Here the content of the Wicket message is 'todo message'. The .properties files define what should be inserted instead of the content, in this example instead of 'todo message'. The default language is English so the DashboardPerspective.properties file contains the English property definition:

todo: My todo list

While the DashboardPerspective_nl.properties contains the Dutch property definition:

todo: Dingen die ik moet doen

The string 'My todo list' or the string 'Dingen die ik moet doen' replaces in the HTML file the content of the wicket:message element with key 'todo'. So the string 'todo message' is replaced. Without any properties files, the string 'todo message' would be used.