DocumentatieAEM 6.5Handboek

De landinstelling van de gebruikersinterface van de AEM Forms-werkruimte wijzigen changing-the-locale-of-aem-forms-workspace-user-interface

Last update: Sun Jul 14 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

Gemaakt voor:

  • Gebruiker
  • Ontwikkelaar

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.

U kunt als volgt 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

Alvorens de bovengenoemde stappen uit te voeren, zorg ervoor dat u de stappen volgt die bij worden vermeld Algemene stappen voor de werkruimteaanpassing van AEM Forms.

NOTE
Om de taal van het login scherm van de werkruimte van AEM Forms te veranderen, zie Creërend een login scherm.

Tekst lokaliseren localizing-text

Voer de volgende stappen uit zodat kunt u steun voor een taal Nieuw en browser scènecode nieuw toevoegen.

  1. Meld u aan bij CRXDE Lite.
    De standaard-URL van CRXDE Lite is https://'[server]:[port]'/lc/crx/de/index.jsp .

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

  3. Kopieer het bestand translation.json van 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.

    translatie_json_in_fr

Samengevouwen categorieën, wachtrijen en processen lokaliseren localizing-collapsed-categories-queues-and-processes

In de AEM Forms-werkruimte worden afbeeldingen gebruikt om koppen van categorieën, wachtrijen en processen weer te geven. U hebt een ontwikkelingspakket nodig om deze koppen te lokaliseren. Voor gedetailleerde informatie over het creëren van een ontwikkelingspakket, zie de werkruimtecode van AEM Forms bouwen.

In de volgende stappen, wordt verondersteld dat de nieuwe gelokaliseerde beelddossiers Categories_nw.png, Queue_nw.png zijn, en Processes_nw.png. De aanbevolen breedte van de afbeeldingen moet op 19 pixels worden ingesteld.

NOTE
U kunt als volgt de landinstellingscode van de browser voor de taal vinden. Open https://'[server]:[port]'/lc/libs/ws/Locale.html.

doen ineenstorten_panels_image

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 het uitgeven en voeg de volgende ingangen toe:

    code language-css 
    #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 Workspace worden vermeld.

  4. Navigeer aan js/runtime/nut omslag en open het {dossier 2} usersessie.js voor het uitgeven.

  5. Bepaal de plaats van de code die in het originele codeblok wordt vermeld en voeg de voorwaarde lang toe!== "nw" aan de if verklaring:

    code language-javascript 
    // 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;
        }
    }
    code language-javascript 
    //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 localizing-date-picker

U vereist een ontwikkelingspakket om datepicker API te lokaliseren. Voor gedetailleerde informatie over het creëren van een ontwikkelingspakket, zie de werkruimtecode van AEM Forms van de Bouw.

  1. Download en haal het pakket jQuery UI, navigeer aan <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 code van de landinstelling nu naar apps/ws/js/libs/jqueryui en breng wijzigingen aan die specifiek zijn voor de landinstelling.

  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 waarmee een alias voor het bestand jquery.ui.datepicker-nw.js wordt gemaakt, is:

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

  5. Gebruik alias jqueryuidatepickernw om het jquery.ui.datepicker-nw.js -bestand op te nemen in alle bestanden 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:

    code language-json 
    //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 language-json 
    // 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 in alle bestanden die de datepicker-API gebruiken de standaard datepicker API-instellingen. 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:

    code language-javascript 
    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['']);
}
    code language-javascript 
    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['']);
}
recommendation-more-help
19ffd973-7af2-44d0-84b5-d547b0dffee2