Creating a new login screen

Creating a new login screen

Search
Applies to: Adobe LiveCycle

某些 Creative Cloud 应用程序、服务和功能在中国不可用。

You can modify the login screen of all Adobe® LiveCycle® modules that use the LiveCycle login screen. For example, the modifications affect the login screen of, both, Forms Manager and HTML Workspace.

Prerequisite

  1. Log in at /lc/crx/de with Administrator permissions.

  2. Perform the following actions:

    1. Replicate the hierarchical structure: of /libs/livecycle/core/content at /apps/livecycle/core/content. Maintain the same (node/folder) properties and access control.
    2. Copy the content folder: from /libs/livecycle/core to /apps/livecycle/core.
    3. Delete the contents of /apps/livecycle/core folder.

  3. Perform these actions:

    1. Replicate the hierarchical structure: of /libs/livecycle/core/components/login at /apps/livecycle/core/components/login.  Maintain the same (node/folder) properties and access control.
    2. Copy the components folder: from /libs/livecycle/core to /apps/livecycle/core.
    3. Delete the contents of the folder: /apps/livecycle/core/components/login.

     

Adding a new locale

  1. Copy the i18n folder:

    • from /libs/livecycle/core/components/login
    • to /apps/livecycle/core/components/login

  2. Delete all the folders inside i18n except one, say en.

  3. On the folder en, perform these actions:

    1. Rename the folder to the locale name you wish to support. For example, ar.
    2. Change the property jcr:language value to ar (for the ar folder).

    Note:

    If locale is a language-country code combination, say, ar-DZ, then change the folder name and property value to ar-DZ.

  4. Copy login.jsp:

    • from /libs/livecycle/core/components/login
    • to /apps/livecycle/core/components/login

  5. Modify the following snippet of code for /apps/livecycle/core/components/login/login.jsp:

    Locale is language code

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    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;
            }
        }

    Locale is language-country code

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    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().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;
            }
        }

    To change Default locale

    1
    2
    3
    4
    5
    6
    7
    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. Copy i18n folder:

    • from /libs/livecycle/core/components/login
    • to /apps/livecycle/core/components/login

  2. Now modify the value of the property sling:message of the node (under the desired locale code folder) for which you wish to change the text. Translation is done via the key mentioned in the value of sling:key property of the node.

  3. For adding new key-value pair, perform the following actions. Check an example in the screenshot that follows.

    1. Create a node of type sling:MessageEntry, or copy an existing node and rename it, under all the locale folders.
    2. Copy login.jsp :
      • from /libs/livecycle/core/components/login
      • to /apps/livecycle/core/components/login
    3. Modify /apps/livecycle/core/components/login/login.jsp to incorporate the newly added text.
    Capture
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    div class="loginContent">
                        <span class="loginFlow"></span>
                        <span class="loginVersion"><%= i18n.get("Version: 11.0.0") %></span>
                        <span class="loginTitle"><%= i18n.get("Login") %></span>
                        <% if (loginFailed) {%>
     
    To
     
    div class="loginContent">
                        <span class="loginFlow"></span>
                        <span class="loginVersion"><%= i18n.get("My Welcome Message") %></span>
                        <span class="loginVersion"><%= i18n.get("Version: 11.0.0") %></span>
                        <span class="loginTitle"><%= i18n.get("Login") %></span>
                        <% if (loginFailed) {%>

Adding new style, or modifying existing style

  1. Copy login node:

    • from /libs/livecycle/core/content
    • to /apps/livecycle/core/content

  2. Delete files login.js and  jquery-1.8.0.min.js, from the node /apps/livecycle/core/content/login.

  3. Modify the styles in the CSS file.

  4. To add new styles:

    1. Add new styles to /apps/livecycle/core/content/login/login.css
    2. Copy login.jsp
      • from /libs/livecycle/core/components/login
      • to /apps/livecycle/core/components/login
    3. Modify /apps/livecycle/core/components/login/login.jsp to incorporate the newly added styles.

  5. For example:

    • Add the following to /apps/livecycle/core/content/login/login.css.
    1
    2
    3
    4
    .newLoginContentArea {
        width: 700px;
        padding: 100px 0px 0px 100px;
    }
    • Modify following in /apps/livecycle/core/components/login.jsp.
    1
    2
    3
    4
    5
    <div class="loginContentArea">
     
    To
     
    <div class="newLoginContentArea">

Note:

If the existing images in /apps/livecycle/core/content/login (copied from /libs/livecycle/core/content/login) are removed, then remove the corresponding references in CSS.

Add new images

  1. Follow the steps of Adding new style, or modifying existing style (documented above).

  2. Add new images in /apps/livecycle/core/content/login. To add image:

    1. Install WebDAV client.
    2. Navigate to /apps/livecycle/core/content/login folder, using webDAV client. For more information, see: Webdav Access.
    3. Add new images.

  3. Add new styles in /apps/livecycle/core/content/login/login.css, corresponding to new images added in /apps/livecycle/core/content/login.

  4. Use the new styles in login.jsp at /apps/livecycle/core/components.

  5. For Example:

    • Add the following to /apps/livecycle/core/content/login/login.css
    1
    2
    3
    4
    5
    6
    .newLoginContainerBkg {
        background-image: url(my_Bg.gif);
        background-repeat: no-repeat;
        background-position: left top;
        width: 727px;
    }
    • Modify following in /apps/livecycle/core/components/login.jsp.
    1
    2
    3
    4
    5
    <div class="loginContainerBkg">
     
    To
     
    <div class="newLginContainerBkg">

More like this