Localizing Your Widget

Follow the steps below to learn how to localize your widget:

  1. If you chose not to use localization when you generated the bundle, follow this step to enable it in your bundle. Create a /features/localization folder in your project and add a Language.properties file to it. Add a create-jar.features.localization key to your .npmbuildrc file that points to the Language.properties file. An example configuration is shown below:

    	"create-jar": {
    		"output-dir": "dist",
    		"features": {
    			"js-extender": true,
    			"web-context": "/my-test-js-widget",
    			"localization": "features/localization/Language",
    			"settings": "features/settings.json"
  2. Configure the Language.properties file and provide the localized property files (e.g. Language_[locale].properties) with the language keys for each available translation. The JavaScript based widget configuration is shown below:

    javax.portlet.title.my_js_portlet_project=My JS Widget Project
    portlet-namespace=Portlet Namespace
    context-path=Context Path
    portlet-element-id=Portlet Element Id
    fruit=Favourite fruit
    fruit-help=Choose the fruit you like the most
    an-orange=An orange
    a-pear=A pear
    an-apple=An apple
  3. Retrieve a language key’s localized value in JavaScript with the Liferay.Language.get('key') method.

Great! Now you know how to localize your widget!

« Configuring System Settings and Instance Settings for Your JavaScript WidgetUsing Translation Features in Your Widget »