AEM Forms 작업 공간 사용자 인터페이스의 로케일 변경

AEM Forms workspace는 영어, 프랑스어, 독일어 및 일본어 지원을 즉시 제공합니다. 또한 AEM Forms 작업 공간 사용자 인터페이스를 다른 언어로 현지화하는 기능도 제공합니다.

AEM Forms 작업 공간 사용자 인터페이스를 원하는 언어로 현지화하려면:

• AEM Forms 작업 영역의 텍스트를 현지화합니다.
• 축소된 카테고리, 큐 및 프로세스를 현지화합니다.
• 날짜 선택기 현지화

위의 단계를 수행하기 전에 다음에 나열된 단계를 수행해야 합니다. AEM Forms 작업 공간 사용자 지정을 위한 일반 단계.

텍스트 현지화

언어에 대한 지원을 추가하려면 다음 단계를 수행하십시오 새로 만들기 및 브라우저 로케일 코드 nw.

1. CRXDE Lite에 로그인합니다.

   CRXDE Lite의 기본 URL은 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. 이미지의 권장 너비는 19px입니다.

이미지를 현지화하려면 다음 단계를 수행하십시오.

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 패키지, 다음 위치로 이동합니다. <extracted jquery="" ui="" package="">\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 datepicker를 사용하는 모든 파일의 파일 datepicker는 다음 파일에서 사용됩니다.

   • 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. Datepicker API를 사용하는 모든 파일에서 기본 datepicker API 설정을 변경합니다. Datepicker 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