AEM Forms Workspace unterstützt standardmäßig die Sprachen Englisch, Französisch, Deutsch und Japanisch. Darüber hinaus besteht die Möglichkeit, die AEM Forms Workspace-Benutzeroberfläche in einer beliebigen anderen Sprache zu lokalisieren.
AEM Forms Workspace-Benutzeroberfläche in einer Sprache Ihrer Wahl lokalisieren:
- Lokalisieren des Texts von AEM Forms Workspace
- Lokalisieren von ausgeblendeten Kategorien, Warteschlangen und Prozessen
- Lokalisieren der Datumsauswahl
Bevor Sie die obengenannten Schritte ausführen, achten Sie darauf, die hier aufgeführten Schritte durchzuführen: Generische Schritte zur Anpassung von AEM Forms Workspace.
Hinweis:
Informationen zum Ändern der Sprache des Anmeldebildschirms von AEM Forms Workspace finden Sie unter Erstellen eines neuen Anmeldebildschirms.
Führen Sie die folgenden Schritte aus, um Unterstützung für eine Sprache Neu und den Browser-Gebietsschema-Code nw hinzuzufügen.
-
Navigieren Sie zu /apps/ws/locales/nw und öffnen Sie translation.json zur Bearbeitung. Nehmen Sie gebietsschemaspezifische Änderungen an der Datei „translation.json“ vor.
Die folgenden Beispiele enthalten die Datei „translation.json“ für die englischen und französischen Gebietsschemata von AEM Forms Workspace.
AEM Forms Workspace verwendet Bilder, um Kopfzeilen von Kategorien, Warteschlangen und Prozessen anzuzeigen. Sie benötigen das Entwicklungspaket um diese Kopfzeilen zu lokalisieren. Ausführliche Informationen zum Erstellen des Entwicklungspakets finden Sie unter Erstellen von AEM Forms Workspace-Code.
In den folgenden Schritten wird davon ausgegangen, dass es sich bei den neuen lokalisierten Bilddateien um Categories_nw.png, Queue_nw.png und Processes_nw.png handelt. Die empfohlene Breite der Bilder ist 19 px.
Hinweis:
Den Browser-Sprachschema-Code Ihres Browsers finden Öffnen Sie http://[server]:[port]/lc/libs/ws/Locale.html.
-
Navigieren Sie zu /apps/ws/css. Öffnen Sie newStyle.css zur Bearbeitung und fügen Sie die folgenden Einträge hinzu:
#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; } -
Führen Sie alle semantischen Änderungen durch, die im Artikel Anpassung von Workspace aufgeführt sind.
-
Suchen Sie den Code, der im ursprünglichen Codeblock aufgeführt ist und fügen Sie die folgende Bedingung hinzu: lang !== 'nw' to the if statement:
// 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; } }
Sie benötigen das Entwicklungspaket, um die Datumsauswahl-API zu lokalisieren. Ausführliche Informationen zum Erstellen des Entwicklungspakets finden Sie unter Erstellen von AEM Forms Workspace-Code.
-
Laden Sie das jQuery UI Package herunter und extrahieren Sie es, navigieren Sie zu <extrahiertes jQuery UI Package>\jquery-ui-1.10.2.zip\jquery-ui-1.10.2\ui\i18n.
-
Verwenden Sie den Alias jqueryuidatepickernw, um die Datei jquery.ui.datepicker-nw.js in allen Dateien einzubinden, die die Datumsauswahl verwenden. Die Datumsauswahl wird in den folgenden Dateien verwendet:
- js/runtime/views/outofoffice.js
- js/runtime/views/searchtemplatedetails.js
Der Beispielcode unten zeigt, wie Sie den Eintrag aus „jquery.ui.datepicker-nw.js“ hinzufügen:
//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) { -
In allen Dateien, die die Datumsauswahl-API verwenden, ändern Sie die Standardeinstellungen der Datumsauswahl-API. Die Datumsauswahl-API wird in den folgenden Dateien verwendet:
- apps\ws\js\runtime\views\searchtemplatedetails.js
- apps\ws\js\runtime\views\outofoffice.js
Ändern Sie den folgenden Code, um das neue Gebietsschema hinzuzufügen: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['']); }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['']); }
Twitter™- und Facebook-Beiträge fallen nicht unter die Bedingungen der Creative Commons-Lizenz.