——————————目录大纲——————————
一、说明
本文进行说明AEM系统中模板与页面创建及使用的流程。
由于AEM中创建页面必须要选择对应的模板,同时页面上能使用的组件也取决于引用模板中给布局设置的policy。
二、模板
1、创建模板
1.1 通过后台UI创建
路径:Tools - General - Templates,点击Templates

点击进入Lenovo Platform AEM Project目录

点击右上角【Create】按钮

选择模板类型,直接选择已有的类型即可,点【Next】

输入模板名称,点击【Create】

提示如下,即创建成功:

注意:如果在本地实例上通过该种方式创建了Template,那么需要从Code层级通过repo等方式拉去到项目中,并最终提交到Git上以便持久化。
1.2 通过Code创建(推荐)
找到对应的模板所在目录,如:
# 根目录可能存在不一样的情况,但是子目录都是万变不离其宗 lenovo-www/ui.content/src/main/content/jcr_root/conf/lenovo-www/settings/wcm/templates

在该目录下,copy现有模板或者新建对应的模板目录,按照之前模板的规则进行创建即可,创建完毕需要对目录执行clean install操作才能发布到local instance实例当中
子目录说明:

| 目录名称 | 目录说明 |
|---|---|
| initial | 初始化基本上是限制一旦创建页面将是什么样的。 |
| policies | 策略是应用在页面上的策略,比如clientlibs应该是什么、什么样的组件能被应用到页面上、什么系统样式等 |
| structure | 就是页面的结构 |
2、模板编辑
2.1 三种模式:
模板编辑页面有三种模式,不同模式的分工不同,大致如下:
- Structure模式,编辑模板的策略及模板的内容结构
- Initial Content模式,使用策略中配置的组件对页面的内容进行初始化
- Layout模式,对页面的大小及尺寸进行配置
2.1.1 Structure模式
编辑模板策略,配置在此模板中可以使用的组件,如(标题、文本等)

2.1.2 Initial Content模式
进入初始化内容编辑模式,在每个页面都会出现固定的内容,点击Drag按钮选择需要的组件

2.1.3 Layout模式
进入Layout模式进行页面的布局调整,可以通过对布局的调整讲组件位置进行摆放

2.2 模板中添加内容
注意,如果没有地方添加组件或者一片空白,可以参考这里面尝试解决:9、问题及其他汇总
点击中部拖拽组件容器,点击右下角图标

点击policy

这里可以通过直接选择左侧policy,也可以手动勾选右侧组件Group,决定哪些组件可以被使用:

设置完毕后刷新页面,可以看到左侧已经能有可选的组件了(需要注意的是如果右边无法拖入组件,那么需要点击Root Container然后点击Unlock图标进行解锁):

此时能通过点击+号或者拖拽的方式加入组件:



尝试为碎片添加导航:

点击浏览选择对应的碎片:

依次展开:

选择碎片(experience fragment):

点击【Done】进行确认:

效果:

3、模板启用
只有Enable之后的模板,才能被页面所使用。
返回前一个页面,选中创建好的模板,点击【Enable】

启用完毕:

4、模板文件结构
首先可以在装修模板的URL地址中,找到模板的路径:

也可以在查看模板属性的时候URL地址中找到:

通过路径:/conf/lenovo-platform/settings/wcm/templates/m_test_template_001,可以在CRX里面找到模板

这里可以查看主属性:

这里可以查看模板里面的结构:

这里表明了当前正在使用网格

模板的policy路径即对应所在地,如:wcm/foundation/components/responsivegrid/policy_1701040807120

5、模板关联
AEM中站点和模板是需要进行关联,才可以在对应站点下创建的时候选择对应的模板。
5.1 从模板上设置允许在哪些路径上使用(常用)
可以在模板上增加属性,设置关联,大致如下:
属性名:allowedPaths 属性值:/content/lenovo(/.*)? 说明:通过正则进行匹配,如:/content/project/en/[^/]+(/.*)? 或者 /content/project/en/xyz/abc/ |
|---|

示例:



也可以添加多个:

对应在代码上提现如下:

设置完毕后别忘记点击左上角保存:

5.2 从站点上设置允许使用哪些模板
在后台选中站点,点击【Properties】

进入【Advanced】标签:

在Template Settings - Allow Templates里面可以添加允许的模板路径:

如:

但是这样会覆盖之前的规则,具体的更广泛的规则还有待研究……
6、使用模板
关联完毕后,选中站点,点击【Create】选择页面:

找到自己的模板,即可创建使用对应模板的页面:

三、模板类型
模板类型相当于一个总集,结构与模板是一样的,但是创建模板的时候选择了对应的模板类型,那么那个模板类型的设置会自动被继承到当前模板下。
1、创建模板类型
在CRXDE平台,进入模板类型目录:/conf/lenovo-www/settings/wcm/template-types,选择一个现有的模板,右击【Copy】:

右击【Paste】:

Copy出来的模板类型:

重命名该模板类型:

修改模板类型的名称和描述:

在 /conf/lenovo-www/settings/wcm/template-types/m-test-base-page/initial/jcr:content 这里可以去修改初始化使用的组件路径

在 /conf/lenovo-www/settings/wcm/template-types/m-test-base-page/structure/jcr:content 这里也需要保持跟上方一致

别忘记操作了都点击【Save all】:

去后台创建模板的时候,可以看到已经能够选择该类型:

2、结构说明
模板类型地址:lenovo-www/ui.content/src/main/content/jcr_root/conf/lenovo-www/settings/wcm/template-types

特定于站点的模板类型应存储在类似位置:
/apps/settings/wcm/template-types
自定义模板类型的定义应存储在用户定义的文件夹中(推荐)或者存储在 global. 例如:
/conf/<my-folder-01>/<my-folder-02>/settings/wcm/template-types/conf/<my-folder>/settings/wcm/template-types/conf/global/settings/wcm/template-types
模板类型必须遵循正确的文件夹结构(即, /settings/wcm/...),否则未找到模板类型。
里面包含3个重要因素:initial、policies、structure

目录说明参考上文中的”通过Code创建模板“
模板类型是将要选择的页面组件的大纲,也就是模板类型只是为了去筛选页面组件的,因此必须基于模板类型来选择模板,因为限制了实际页面的组件,每个模板类型都与页面组件相关联,模板类型的initial属性里面有个sling:resourceType,对应在apps下面页面组件的设置也是这个,所以模板类型限制了关联页面上可以使用的组件,
所以每个页面,比如客户限制将使用什么,它的结构是什么,如果我们有任何分析配置或页面布局,一切都是由页面组件定义的,但是页面的结构和外观是在模板中定义的。
四、模板、页面、模板类型关系网
1、模板与页面
页面的jcr:content中的cq:template即页面所使用的模板,如:/conf/lenovo-base/settings/wcm/templates/lenovo-solutions-template

2、模板与模板类型
模板的jcr:content中的cq:templateType即为所用的模板类型,如:/conf/lenovo-base/settings/wcm/template-types/solutions-page
