更改AEM Forms工作区用户界面的区域设置

AEM Forms工作区提供英语、法语、德语和日语的开箱即用支持。 它还提供了将AEM Forms工作区用户界面本地化为任何其他语言的功能。

要将AEM Forms工作区用户界面本地化为您选择的语言，请执行以下操作：

• 将AEM Forms工作区的文本本地化。
• 将折叠的类别、队列和流程本地化。
• 本地化日期选取器

在执行上述步骤之前，请确保遵循AEM Forms工作区自定义的一般步骤中列出的步骤。

本地化文本

执行以下步骤以添加对语言​New​和浏览器区域设置代码​nw​的支持。

1. 登录到CRXDE Lite。

   默认CRXDE LiteURL为https://[server]:[port]/lc/crx/de/index.jsp。

2. 导航到位置apps/ws/locales并创建新文件夹nw.

3. 将文件translation.json从位置/apps/ws/locales/en-US复制到位置/apps/ws/locales/nw。

4. 导航到/apps/ws/locales/nw并打开translation.json进行编辑。 对translation.json文件进行区域设置特定的更改。

   以下示例包含AEM Forms工作区的英语和法语区域设置的translation.json文件。

   

本地化折叠的类别、队列和进程

AEM Forms工作区使用图像来显示类别、队列和流程的标题。 您需要开发包才能将这些标头本地化。 有关创建开发包的详细信息，请参阅构建AEM Forms工作区代码。

在以下步骤中，假定新的本地化图像文件为​Categories_nw.png、Queue_nw.png​和​Processes_nw.png。 推荐的图像宽度为19像素。

执行以下步骤将图像本地化：

1. 使用WebDAV客户端，将图像文件放在​/apps/ws/images​文件夹中。

2. 导航到​/apps/ws/css。 打开​newStyle.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. 执行工作区自定义文章中列出的所有语义更改。

4. 导航到​js/runtime/utility​文件夹，然后打开* usersession.js*文件进行编辑。

5. 找到原始代码块中列出的代码并添加条件​lang !== 'nw'​到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;
           }
       }
   

本地化日期选取器

您需要开发包才能将*datepicker *API本地化。 有关创建开发包的详细信息，请参阅构建AEM Forms工作区代码。

1. 下载并解压缩jQuery UI包，导航到​<已提取的jquery UI包>\jquery-ui-1.10.2.zip\jquery-ui-1.10.2\ui\i18n。

2. 将区域设置代码的jquery.ui.datepicker-nw.js文件新复制到apps/ws/js/libs/jqueryui，并对文件进行区域设置特定的更改。

3. 导航到apps/ws/js并打开jquery.ui.datepicker-nw.js文件进行编辑。

4. 在main.js文件中为jquery.ui.datepicker-nw.js.创建别名。为jquery.ui.datepicker-nw.js文件创建别名的代码为：

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

5. 使用别名jqueryuidatepickernw将jquery.ui.datepicker-nw.js文件包含在所有使用日期选取器的文件中。 日期选取器在以下文件中使用：

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

   以下示例代码显示如何添加jquery.ui.datepicker-nw.js的条目：

   //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. 在所有使用日期选取器API的文件中，更改默认的日期选取器API设置。 日期选取器API用于以下文件：

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

   更改以下代码以添加新区域设置：

   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['']);
}

Business.Adobe.com 资源

Auto Text Summarization Theme Editor Managed Cloud Content As A Service Digital Asset Management Content Management System