설명서AEM 6.5사용 안내서

로그인 화면 만들기 creating-a-new-login-screen

Last update: Mon Jul 15 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

작성 대상:

  • 사용자
  • 개발자

AEM Forms 로그인 화면을 사용하는 모든 AEM Forms 모듈의 로그인 화면을 수정할 수 있습니다. 예를 들어 수정 사항은 Forms Manager 및 AEM Forms 작업 공간 의 로그인 화면에 모두 영향을 줍니다.

전제 조건 prerequisite

  1. 관리자 권한으로 /lc/crx/de에 로그인합니다.

  2. 다음 작업을 수행합니다.

    1. /apps/livecycle/core/content에 있는 /libs/livecycle/core/content의 계층 구조를 복제합니다.

      동일한 (노드/폴더) 속성 및 액세스 제어를 유지합니다.

    2. 컨텐츠 폴더를 복사합니다.

      보낸 사람: /libs/livecycle/core

      받는 사람: /apps/livecycle/core.

    3. /apps/livecycle/core 폴더의 내용을 삭제합니다.

  3. 다음 작업을 수행합니다.

    1. /apps/livecycle/core/components/login에 있는 /libs/livecycle/core/components/login의 계층 구조를 복제합니다. 동일한 (노드/폴더) 속성 및 액세스 제어를 유지합니다.

    2. 구성 요소 폴더를 /libs/livecycle/core에서 /apps/livecycle/core(으)로 복사합니다.

    3. /apps/livecycle/core/components/login 폴더의 내용을 삭제합니다.

새 로케일 추가 adding-a-new-locale

  1. i18n 폴더 복사:

    • 변환 전: /libs/livecycle/core/components/login
    • /apps/livecycle/core/components/login에

  2. i18n 내의 폴더 중 하나를 제외한 모든 폴더를 삭제합니다. en.

  3. en 폴더에서 다음 작업을 수행합니다.

    1. 지원할 로케일 이름으로 폴더 이름을 변경합니다. 예: ar

    2. 속성 jcr:language 값을 ar 폴더의 ar(으)로 변경합니다.

    note note
    NOTE
    locale이 언어-국가 코드 조합인 경우(예: ar-DZ) 폴더 이름과 속성 값을 ar-DZ(으)로 변경합니다.

  4. login.jsp 복사:

    • 변환 전: /libs/livecycle/core/components/login
    • /apps/livecycle/core/components/login에

  5. /apps/livecycle/core/components/login/login.jsp에 대해 다음 코드 조각을 수정합니다.

로케일은 언어 코드입니다

String browserLocale = "en";

    for(int i=0; i<locales.length; i++)
    {
        String prioperty = locales[i];
        if(prioperty.trim().startsWith("en")) {
            browserLocale = "en";
            break;
        }
        if(prioperty.trim().startsWith("de")){
            browserLocale = "de";
            break;
        }
        if(prioperty.trim().startsWith("ja")){
            browserLocale = "ja";
            break;
        }
        if(prioperty.trim().startsWith("fr")){
            browserLocale = "fr";
            break;
        }
    }

끝

String browserLocale = "en";
    for(int i=0; i<locales.length; i++)
    {
        String prioperty = locales[i];
        if(prioperty.trim().startsWith("ar")) {
            browserLocale = "ar";
            break;
        }
        if(prioperty.trim().startsWith("en")) {
            browserLocale = "en";
            break;
        }
        if(prioperty.trim().startsWith("de")){
            browserLocale = "de";
            break;
        }
        if(prioperty.trim().startsWith("ja")){
            browserLocale = "ja";
            break;
        }
        if(prioperty.trim().startsWith("fr")){
            browserLocale = "fr";
            break;
        }
    }

String browserLocale = "en";

    for(int i=0; i<locales.length; i++)
    {
        String prioperty = locales[i];
        if(prioperty.trim().startsWith("en")) {
            browserLocale = "en";
            break;
        }
        if(prioperty.trim().startsWith("de")){
            browserLocale = "de";
            break;
        }
        if(prioperty.trim().startsWith("ja")){
            browserLocale = "ja";
            break;
        }
        if(prioperty.trim().startsWith("fr")){
            browserLocale = "fr";
            break;
        }
    }

끝

String browserLocale = "en";
    for(int i=0; i<locales.length; i++)
    {
        String prioperty = locales[i];
        if(prioperty.trim().equalsIgnoreCase("ar-DZ")) {
            browserLocale = "ar-DZ";
            break;
        }
        if(prioperty.trim().startsWith("en")) {
            browserLocale = "en";
            break;
        }
        if(prioperty.trim().startsWith("de")){
            browserLocale = "de";
            break;
        }
        if(prioperty.trim().startsWith("ja")){
            browserLocale = "ja";
            break;
        }
        if(prioperty.trim().startsWith("fr")){
            browserLocale = "fr";
            break;
        }
    }

기본 로케일을 변경하려면

   String browserLocale = "en";
   for(int i=0; i<locales.length; i++)

   To

   String browserLocale = "ar";
   for(int i=0; i<locales.length; i++)

새 텍스트 추가 또는 기존 텍스트 수정 adding-new-text-or-modifying-existing-text

  1. i18n 폴더 복사:

    • 변환 전: /libs/livecycle/core/components/login
    • /apps/livecycle/core/components/login에

  2. 이제 텍스트를 변경할 노드의 sling:message 속성 값(원하는 로케일 코드 폴더 아래)을 수정합니다. 변환은 노드의 sling:key 속성 값에 언급된 키를 통해 수행됩니다.

  3. 새 키-값 쌍을 추가하려면 다음 작업을 수행합니다. 다음 스크린샷에서 예를 확인하십시오.

    1. 모든 로케일 폴더에서 sling:MessageEntry 유형의 노드를 만들거나 기존 노드를 복사하고 이름을 바꾸십시오.

    2. login.jsp 복사:

      • 변환 전: /libs/livecycle/core/components/login

      • /apps/livecycle/core/components/login에

    3. /apps/livecycle/core/components/login/login.jsp을(를) 수정하여 새로 추가된 텍스트를 통합합니다.

    새 키-값 쌍 추가

    code language-jsp 
    div class="loginContent">

                    <span class="loginFlow"></code>
                    <span class="loginVersion"><%= i18n.get("Version: 11.0.0") %></code>
                    <span class="loginTitle"><%= i18n.get("Login") %></code>
                    <% if (loginFailed) {%>

    끝

    code language-jsp 
    div class="loginContent">

                    <span class="loginFlow"></code>
                    <span class="loginVersion"><%= i18n.get("My Welcome Message") %></code>
                    <span class="loginVersion"><%= i18n.get("Version: 11.0.0") %></code>
                    <span class="loginTitle"><%= i18n.get("Login") %></code>
                    <% if (loginFailed) {%>

새 스타일 추가 또는 기존 스타일 수정 adding-new-style-or-modifying-existing-style

  1. login 노드 복사:

    • 변환 전: /libs/livecycle/core/content
    • /apps/livecycle/core/content에

  2. /apps/livecycle/core/content/login. 노드에서 login.js 및 jquery-1.8.0.min.js 파일을 삭제합니다.

  3. CSS 파일의 스타일을 수정합니다.

  4. 새 스타일을 추가하려면:

    1. /apps/livecycle/core/content/login/login.css에 새 스타일 추가

    2. login.jsp 복사

      • 변환 전: /libs/livecycle/core/components/login

      • /apps/livecycle/core/components/login에

    3. /apps/livecycle/core/components/login/login.jsp을(를) 수정하여 새로 추가된 스타일을 통합합니다.

예:

  • /apps/livecycle/core/content/login/login.css에 다음 내용을 추가하십시오.
css.newLoginContentArea {
    width: 700px;
    padding: 100px 0px 0px 100px;
   }

  • /apps/livecycle/core/components/login.jsp에서 다음을 수정합니다.

    code language-jsp 
    <div class="loginContentArea">

    끝

    code language-jsp 
    <div class="newLoginContentArea">
NOTE
/apps/livecycle/core/content/login의 기존 이미지(/libs/livecycle/core/content/login에서 복사됨)가 제거되면 CSS에서 해당 참조를 제거하십시오.

새 이미지 추가 add-new-images

  1. 새 스타일을 추가하거나 기존 스타일을 수정하는 단계(위에 설명된)를 따릅니다.

  2. /apps/livecycle/core/content/login에 새 이미지를 추가합니다. 이미지를 추가하려면:

    1. WebDAV 클라이언트를 설치합니다.

    2. webDAV 클라이언트를 사용하여 /apps/livecycle/core/content/login 폴더로 이동합니다. 자세한 내용은 WebDAV 액세스를 참조하십시오.

    3. 새 이미지를 추가합니다.

  3. /apps/livecycle/core/content/login에 추가된 새 이미지에 해당하는 새 스타일을 /apps/livecycle/core/content/login/login.css,에 추가합니다.

  4. login.jsp의 /apps/livecycle/core/components에서 새 스타일을 사용합니다.

예:

.newLoginContainerBkg {

 background-image: url(my_Bg.gif);
 background-repeat: no-repeat;
 background-position: left top;
 width: 727px;
}

* /apps/livecycle/core/components/login.jsp에서 다음을 수정합니다.

<div class="loginContainerBkg">

끝

<div class="newLginContainerBkg">
recommendation-more-help
19ffd973-7af2-44d0-84b5-d547b0dffee2