通信管理允许您重新品牌化其解决方案模板,以获得更好的品牌价值并遵守贵组织的品牌标准。 重新品牌化用户界面包括更改组织徽标,该徽标显示在创建通信UI的左上角。
您可以在创建通信UI中使用您组织的徽标更改徽标。
创建通信UI中的自定义图标
要设置您选择的徽标图像,请执行以下操作:
创建适当的 CRX中的文件夹结构.
上传新的徽标文件 (在您已在CRX中创建的文件夹中)。
设置CSS 在CRX上引用新徽标。
清除浏览器历史记录并 刷新创建通信UI.
创建文件夹结构(如下所述),用于托管自定义徽标图像和样式表。 根文件夹/apps的新文件夹结构与/libs文件夹的结构类似。
对于任何自定义设置,请在/apps分支中创建并行文件夹结构,如下所述。
此 /apps
分支(文件夹结构):
/libs
分支将更新,如果您将更改托管在 /libs
分支,它们将被覆盖。/apps
先分支,然后分支 /libs
分支以查找资源。 此机制意味着系统使用您的叠加(以及其中定义的自定义项)。使用以下步骤在中创建所需的文件夹结构 /apps
分支:
转到 https://'[server]:[port]'/[ContextPath]/crx/de
并以管理员身份登录。
在apps文件夹中,创建一个名为 css
路径/结构与css文件夹(在crui文件夹中)类似。
创建css文件夹的步骤:
右键单击 css 路径下的文件夹并选择 覆盖节点: /libs/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/css
确保“覆盖节点”对话框具有以下值:
路径: /libs/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/css
覆盖位置: /apps/
匹配节点类型: 已选中
请勿更改 /libs
分支。 您所做的任何更改都可能会丢失,因为每当您:
* 在实例上升级
* 应用热修复程序
* 安装功能包
单击确定。css文件夹在指定的路径中创建。
在apps文件夹中,创建一个名为 imgs
路径/结构与imgs文件夹(在ccrui文件夹中)类似。
右键单击 imgs 路径下的文件夹并选择 覆盖节点: /libs/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/imgs
确保“覆盖节点”对话框具有以下值:
路径: /libs/fd/cm/ccr/gui/components/admin/clientlibs/crui/imgs
叠加位置: /apps/
匹配节点类型: 已选中
单击确定。
您还可以在/apps文件夹中手动创建文件夹结构。
单击 全部保存 以保存服务器上的更改。
将您的自定义徽标文件上传到CRX。 标准HTML规则管理徽标的呈现。 根据您用于访问AEM Forms的浏览器,支持的图像文件格式会有所不同。 所有浏览器都支持JPEG、GIF和PNG。 有关更多信息,请参阅特定于浏览器的文档,了解支持的图像格式。
使用以下步骤将自定义徽标文件上传到CRX:
转到 https://'[server]:[port]'/[contextpath]/crx/de
. 如有必要,请以管理员身份登录。
在CRXDE中,右键单击 imgs 路径下的文件夹并选择 “创建”>“创建文件”:
/apps/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/imgs/
在“创建文件”对话框中,以CustomLogo.png格式输入文件名(或您的徽标文件名)。
单击全部保存。
在您创建的新文件(此处为CustomLogo.png)下,将显示jcr:content属性。
单击文件夹结构中的jcr:content。
此时将显示jcr:content的属性。
双击 jcr:data 属性。
此时将显示“编辑jcr:data”对话框。
现在,单击newlogo.png文件夹,然后双击jcr:content (dim选项)并设置nt:resource类型。 如果该属性不存在,请创建名为jcr:content的属性。
在“编辑jcr:data”对话框中,单击 浏览 并选择要用作徽标的图像文件(此处为CustomLogo.png)。
根据您用于访问AEM Forms的浏览器,支持的图像文件格式会有所不同。 所有浏览器都支持JPEG、GIF和PNG。 有关更多信息,请参阅特定于浏览器的文档,了解支持的图像格式。
示例:用作自定义徽标的CustomLogo.png
单击全部保存。
自定义徽标图像需要在内容上下文中加载其他样式表。
使用以下步骤可创建样式表,以便通过UI呈现徽标:
转到 https://'[server]:[port]'/[contextpath]/crx/de
. 如有必要,请以管理员身份登录。
在以下位置创建一个名为customcss.css的文件(不能使用其他文件名):
/apps/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/css/
创建customcss.css文件的步骤:
右键单击 css 文件夹并选择 “创建”>“创建文件”.
在“新建文件”对话框中,将CSS的名称指定为 customcss.css
(不能使用其他文件名),然后单击 确定.
将以下代码添加到新创建的css文件中。 在代码的content:url中,指定您上传到CRXDE中的imgs文件夹的图像名称。
.logo, .logo:after {
content:url("../imgs/CustomLogo.png");
}
单击全部保存。
清除浏览器缓存,然后在浏览器中打开创建通信UI实例,以便您可以看到自定义徽标。
创建通信UI中的自定义图标