De landinstelling van de gebruikersinterface van de AEM Forms-werkruimte wijzigen

De werkruimte van AEM Forms biedt vanuit de verpakking ondersteuning voor Engelse, Franse, Duitse en Japanse talen. Het biedt ook de mogelijkheid om de gebruikersinterface van de AEM Forms-werkruimte te lokaliseren naar een andere taal.

De gebruikersinterface van de AEM Forms-werkruimte lokaliseren naar de taal van uw keuze:

• Tekst van de AEM Forms-werkruimte lokaliseren.
• U kunt samengevouwen categorieën, wachtrijen en processen lokaliseren.
• Datumkiezer lokaliseren

Voordat u de bovenstaande stappen uitvoert, moet u de stappen volgen die worden vermeld bij Algemene stappen voor aanpassing van de AEM Forms-werkruimte.

Tekst lokaliseren

Voer de volgende stappen uit om ondersteuning toe te voegen voor een taal Nieuw en de landinstellingscode nw van de browser.

1. Meld u aan bij CRXDE Lite.

   De standaard-URL van CRXDE Lite is https://[server]:[port]/lc/crx/de/index.jsp.

2. Navigeer naar de locatie apps/ws/locales en maak een nieuwe map nw.

3. Kopieer het bestand translation.jsonvan de locatie /apps/ws/locales/en-US naar de locatie /apps/ws/locales/nw.

4. Navigeer naar /apps/ws/locales/nw en open translation.json voor bewerking. Wijzig de landinstelling in het bestand translatie.json.

   De volgende voorbeelden bevatten het bestand translatie.json voor Engelse en Franse landinstellingen van de AEM Forms-werkruimte.

   

Samengevouwen categorieën, wachtrijen en processen lokaliseren

In de AEM Forms-werkruimte worden afbeeldingen gebruikt om koppen van categorieën, wachtrijen en processen weer te geven. U hebt ontwikkelingspakket nodig om deze koppen te lokaliseren. Zie AEM Forms-werkruimtecode samenstellen voor gedetailleerde informatie over het maken van ontwikkelingspakket.

In de volgende stappen wordt aangenomen dat de nieuwe gelokaliseerde afbeeldingsbestanden Categories_nw.png, Queue_nw.png en Processes_nw.png zijn. De aanbevolen breedte van de afbeeldingen is 19 px.

Voer de volgende stappen uit om de afbeeldingen te lokaliseren:

1. Plaats de afbeeldingsbestanden met een WebDAV-client in de map /apps/ws/images.

2. Navigeer naar /apps/ws/css. Open newStyle.css voor bewerking en voeg de volgende vermeldingen toe:

   #categoryListBar .content.nw {
        background: #3e3e3e url(../images/Categories_nw.png) no-repeat 10px 10px;
    }
   
   #filterListBar .content.nw {
       background: #3e3e3e url(../images/Queues_nw.png) no-repeat 10px 10px;
   }
   
   #processNameListBar .content.nw {
       background: #3e3e3e url(../images/Processes_nw.png) no-repeat 10px 10px;
   }
   

3. Voer alle semantische veranderingen uit die in het artikel van de Aanpassing van de Werkruimte worden vermeld.

4. Navigeer naar de map js/runtime/utility en open het bestand* usersessie.js* voor bewerking.

5. Zoek de code in het oorspronkelijke codeblok en voeg voorwaarde lang ! toe== 'nw' naar de instructie if:

   // Orignal code
   setLocale = function () {
           var lang = $.trim(i18n.lng());
           if (lang === null || lang === '' || (lang !== 'fr-FR' && lang !== 'de-DE' && lang !== 'ja-JP')) {
               window.lcWorkspace.locale = 'en-US';
           } else {
               window.lcWorkspace.locale = lang;
           }
       }
   

   //new code
    setLocale = function () {
           var lang = $.trim(i18n.lng());
           if (lang === null || lang === '' || (lang !== 'fr-FR' && lang !== 'de-DE' && lang !== 'ja-JP' && lang !== 'nw')) {
               window.lcWorkspace.locale = 'en-US';
           } else {
               window.lcWorkspace.locale = lang;
           }
       }
   

Datumkiezer lokaliseren

U hebt ontwikkelingspakket nodig om de *datepicker *API te lokaliseren. Zie AEM Forms-werkruimtecode maken voor gedetailleerde informatie over het maken van een ontwikkelingspakket.

1. Download en extraheer het jQuery UI-pakket, navigeer naar <extracted jquery UI package>\jquery-ui-1.10.2.zip\jquery-ui-1.10.2\ui\i18n.

2. Kopieer het bestand jquery.ui.datepicker-nw.js voor de landinstellingscode nu naar apps/ws/js/libs/jqueryui en breng specifieke wijzigingen voor de landinstelling aan in het bestand.

3. Navigeer naar apps/ws/js en open het jquery.ui.datepicker-nw.js bestand voor bewerking.

4. Maak in het bestand main.js een alias voor jquery.ui.datepicker-nw.js. De code voor het maken van een alias voor het bestand jquery.ui.datepicker-nw.js is:

   jqueryuidatepickernw : pathprefix + 'libs/jqueryui/jquery.ui.datepicker-nw'
   

5. Gebruik alias jqueryuidatepickernw om het jquery.ui.datepicker-nw.js dossier in alle dossiers op te nemen die datepicker gebruiken. De datepicker wordt gebruikt in de volgende bestanden:

   • js/runtime/views/outofoffice.js
   • js/runtime/views/searchtemplatedetails.js

   De voorbeeldcode hieronder laat zien hoe u de vermelding jquery.ui.datepicker-nw.js toevoegt:

   //Original Code
   define([
       'jquery',
       'underscore',
       'backbone',
       'jqueryui',
       'jqueryuidatepickerja',
       'jqueryuidatepickerde',
       'jqueryuidatepickerfr',
       'slimscroll',
       'usersearchview',
       'logmanagerutil',
       'loggerutil'
   ], function ($, _, Backbone, jQueryUI, jQueryUIDatePickerJA, jQueryUIDatePickerDE, jQueryUIDatePickerFR, slimScroll, UserSearch, LogManager, Logger) {
   

   // Code with Date Picker alias for new language
   define([
       'jquery',
       'underscore',
       'backbone',
       'jqueryui',
       'jqueryuidatepickerja',
       'jqueryuidatepickerde',
       'jqueryuidatepickerfr',
       'jqueryuidatepickernw', // Date Picker alias
       'slimscroll',
       'usersearchview',
       'logmanagerutil',
       'loggerutil'
   ], function ($, _, Backbone, jQueryUI, jQueryUIDatePickerJA, jQueryUIDatePickerDE, jQueryUIDatePickerFR, jQueryUIDatePickerNW, slimScroll, UserSearch, LogManager, Logger) {
   

6. Wijzig de standaard datepicker API-instellingen in alle bestanden die de datepicker API gebruiken. De datepicker-API wordt gebruikt in de volgende bestanden:

   • apps\ws\js\runtime\views\searchtemplatedetails.js
   • apps\ws\js\runtime\views\outofoffice.js

   Wijzig de volgende code om de nieuwe landinstelling toe te voegen:

   if (locale === 'ja-JP') {
      $.datepicker.setDefaults($.datepicker.regional.ja);
   } else if (locale === 'de-DE') {
      $.datepicker.setDefaults($.datepicker.regional.de);
   } else if (locale === 'fr-FR') {
      $.datepicker.setDefaults($.datepicker.regional.fr);
   } else {
      $.datepicker.setDefaults($.datepicker.regional['']);
   }
   

tot

if (locale === 'ja-JP') {
    $.datepicker.setDefaults($.datepicker.regional.ja);
} else if (locale === 'de-DE') {
    $.datepicker.setDefaults($.datepicker.regional.de);
} else if (locale === 'fr-FR') {
    $.datepicker.setDefaults($.datepicker.regional.fr);
} else if (locale === 'nw') {
    $.datepicker.setDefaults($.datepicker.regional.nw);
} else {
    $.datepicker.setDefaults($.datepicker.regional['']);
}