新規ログイン画面の作成

AEM Forms ログイン画面を使用するすべての AEM Forms モジュールのログイン画面を変更することができます。例えば、変更すると Forms Manager および AEM Forms Workspace の両方のログイン画面に影響が及びます。

前提条件

  1. /lc/crx/deに管理者権限でログインします。

  2. 次のアクションを実行します。

    1. 階層構造を複製します。の/libs/livecycle/core/content/apps/livecycle/core/contentに配置します。

      同じ(ノード/フォルダー)プロパティおよびアクセス制御を保持します。

    2. コンテンツフォルダーをコピーします。

      追加の: /libs/livecycle/core

      を: /apps/livecycle/core.

    3. /apps/livecycle/coreフォルダーの内容を削除します。

  3. 次の操作を実行します。

    1. 階層構造を複製します。の/libs/livecycle/core/components/login/apps/livecycle/core/components/loginに配置します。 同じ(ノード/フォルダー)プロパティおよびアクセス制御を保持します。

    2. componentsフォルダーをコピーします。を/libs/livecycle/coreから/apps/livecycle/coreに変更します。

    3. フォルダーの内容を削除します。/apps/livecycle/core/components/login.

新しいロケールの追加

  1. i18nフォルダーをコピーします。

    • コピー元:/libs/livecycle/core/components/login
    • コピー先:/apps/livecycle/core/components/login
  2. i18n内のフォルダーを1つを除き(例:en)削除します。

  3. フォルダー en で、以下のアクションを実行します。

    1. フォルダーの名前をサポートするロケール名に変更します。例:ar

    2. プロパティjcr:languageの値をararフォルダー用)に変更します。

    メモ

    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;
        }
    }

To

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++)

新しいテキストの追加、または既存のテキストの変更

  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を変更して、新しく追加したテキストを取り込みます。

    追加新しいキーと値のペア

    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) {%>
    

    宛先

    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) {%>
    

新しいスタイルの追加、または既存のスタイルの変更

  1. loginノードをコピー:

    • コピー元:/libs/livecycle/core/content
    • コピー先:/apps/livecycle/core/content
  2. ノード/apps/livecycle/core/content/login.からファイルlogin.jsjquery-1.8.0.min.jsを削除します

  3. CSS ファイルのスタイルを変更します。

  4. 新しいスタイルを追加するには:

    1. <a0/追加>に対する新しいスタイル/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で以下を変更します。

    <div class="loginContentArea">
    

    宛先

    <div class="newLoginContentArea">
    
メモ

/apps/livecycle/core/content/login/libs/livecycle/core/content/loginからコピーした)内の既存の画像が削除された場合は、CSSで対応する参照を削除します。

新しい画像の追加

  1. 上記の「新しいスタイルの追加、または既存のスタイルの変更」の手順に従います。

  2. <a0/追加>の新しい画像。 /apps/livecycle/core/content/login画像を追加するには:

    1. WebDAV クライアントをインストールします。

    2. webDAVクライアントを使用して/apps/livecycle/core/content/loginフォルダーに移動します。 詳しくは、次を参照してください。https://dev.day.com/docs/en/crx/current/how_to/webdav_access.html.

    3. 新しい画像を追加します。

  3. <a1/追加>に追加された新しい画像に対応する/apps/livecycle/core/content/login/login.css,の新しいスタイル。/apps/livecycle/core/content/login

  4. /apps/livecycle/core/componentslogin.jspで新しいスタイルを使用します。

以下に例を示します。

.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">

このページ