创建登录屏幕 creating-a-new-login-screen
您可以修改所有使用AEM Forms登录屏幕的AEM Forms模块的登录屏幕。 例如,修改会同时影响Forms Manager和AEM Forms工作区的登录屏幕。
先决条件 prerequisite
-
使用管理员权限在
/lc/crx/de
登录。 -
执行以下操作:
-
在
/apps/livecycle/core/content
处复制/libs/livecycle/core/content
的分层结构。维护相同的(节点/文件夹)属性和访问控制。
-
复制内容文件夹:
发件人:
/libs/livecycle/core
收件人:
/apps/livecycle/core
。 -
删除
/apps/livecycle/core
文件夹的内容。
-
-
执行以下操作:
-
在
/apps/livecycle/core/components/login
处复制/libs/livecycle/core/components/login
的分层结构。 维护相同的(节点/文件夹)属性和访问控制。 -
将组件文件夹:从
/libs/livecycle/core
复制到/apps/livecycle/core
。 -
删除文件夹的内容:
/apps/livecycle/core/components/login
。
-
添加新区域设置 adding-a-new-locale
-
复制
i18n
文件夹:- 从
/libs/livecycle/core/components/login
- 至
/apps/livecycle/core/components/login
- 从
-
删除
i18n
中的所有文件夹(除一个文件夹外),例如en
。 -
在文件夹
en
上,执行以下操作:-
将文件夹重命名为要支持的区域设置名称。 例如:
ar
。 -
将
ar
文件夹的属性jcr:language
值更改为ar
。
note note NOTE 如果区域设置是语言 — 国家/地区代码组合,例如 ar-DZ
,则将文件夹名称和属性值更改为ar-DZ
。 -
-
复制
login.jsp
:- 从
/libs/livecycle/core/components/login
- 至
/apps/livecycle/core/components/login
- 从
-
修改
/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
-
复制
i18n
文件夹:- 从
/libs/livecycle/core/components/login
- 至
/apps/livecycle/core/components/login
- 从
-
现在,修改要更改其文本的节点的属性
sling:message
的值(在所需的区域设置代码文件夹下)。 通过节点的sling:key
属性值中提到的键完成翻译。 -
要添加新的键值对,请执行以下步骤。 查看以下屏幕快照中的示例。
-
在所有区域设置文件夹下创建类型为
sling:MessageEntry
的节点,或复制现有节点并将其重命名。 -
复制
login.jsp
:-
从
/libs/livecycle/core/components/login
-
至
/apps/livecycle/core/components/login
-
-
修改
/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
-
复制
login
节点:- 从
/libs/livecycle/core/content
- 至
/apps/livecycle/core/content
- 从
-
从节点
/apps/livecycle/core/content/login.
删除文件login.js
和jquery-1.8.0.min.js
-
修改CSS文件中的样式。
-
要添加新样式,请执行以下操作:
-
向
/apps/livecycle/core/content/login/login.css
添加新样式 -
复制
login.jsp
-
从
/libs/livecycle/core/components/login
-
至
/apps/livecycle/core/components/login
-
-
修改
/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">
/apps/livecycle/core/content/login
(从/libs/livecycle/core/content/login
复制)中的现有图像,则删除CSS中的相应引用。添加新图像 add-new-images
-
按照添加新样式或修改现有样式(如上所述)的步骤操作。
-
在
/apps/livecycle/core/content/login
中添加新图像。 要添加图像,请执行以下操作:-
安装WebDAV客户端。
-
使用webDAV客户端导航到
/apps/livecycle/core/content/login
文件夹。 有关详细信息,请参阅WebDAV访问。 -
添加新图像。
-
-
在
/apps/livecycle/core/content/login/login.css,
中添加与在/apps/livecycle/core/content/login
中添加的新图像对应的新样式。 -
在
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">