Blogs > Editable Templates in AEM

AEM Sites

Templates in AEM

Infodales Tech Solutions | March 25, 2023

Hi, happy to find you. Welcome to another blog.

Editable Templates in AEM

Editable Templates are pre-designed feature of AEM that outline the layout, design, and components for a web page. They serve as guides, establishing how content should be organized on a page. By defining the arrangement of elements such as text, images, and other components, templates help maintain consistency across different pages.

Creation of Templates

Let us understand the concept of templates in AEM by creating one.

  • In order to create a template, we need to have a template type. Here we are using a page as a template type. To do so navigate to tools, general, templates and create one template.



  • Having created the template, we can see that it is in draft state. This means while creating a page with this template, the template itself will not be visible. Hence we need to enable it.


  • Now let us simply create a page with the template created. Go to the sites, create a page, choose content template to create page and here we have named it as home page.


  • After creating so, let us add some components to the page but for that we need to add them to the policies of the template. Policies are set of rules that not only allows the component to be added in on the page but also can add some styling to it. To do so, go to edit template and you will open the template of the created page.

  • Now here at the top right corner, we can see structure and on clicking it we can see structure, initial and layout.

  • Structure: When we add components to the sturure, those components cannot de removed from the page directly and will be present in all the pages created with this template before or after adding the componnet.

  • Initial Content: When we add components to the initial content, those components can be removed from the page directly and will be present in all the pages created with this template after adding the componnet.

  • Layout: This adjests the layout of the container added on the template and also the components added.

  • Lets add a component to the template. Click on the container, go to policies and add a component. Here we have added breadcrumb component in structure and text component in initial content.




  • Now let us understand the this in crx/de. In conf folder, there exists your project folder there in you find settings, wcm and templates. In templates your templates are stored with policies, structure and inital content. In template types, your base template is stored.

Custom Template Types

We can even create our own custom template type for the purpose of creation of a template. Simply copy the predefined template type and configure it. Let us understand how do we actually configure it.

  • In inital jcr:content, we need to add the sling:resourceType as our page component of the project. Also we can predefine the template to which the template type will be configured.


  • Similarly to root and container of the inital, we need to add the sling:resourceType property that points to the container comnponent of the project.

  • In jcr:content of the template type, we need to add the description as well as the title of the template type.

  • In jcr:content of policies, we need to add the cq:policies that points to project level page policies and leaving the sling:resourceType pointing to core components policy mapping untouched.

  • In structure jcr:content, root and container, we need to add sling:resourceType pointing to the same page component.


  • This ensures completion of creation of a custom template type for the p[urpose of creation of the template. When you navigate to tools then to templates and then to your project wherein you have specified the template type, you ca start to create a template with the custom template type now.

Template Content Policies and Page Policies

Policies in templates as discussed earlier are indeed the configurations which describe the set of components allowed as well as design and style configured.

cq:policy, in created templates is an important property that provides a reference to the content policy for paragraph system of the page along with the references to the actual components whereas the actual policy definations are stored under /settings/wcm/policies/wcm/foundation/components. Pages policies are the content policies for the main parsys container of the page.

Unavailibility of Templates while Creating a Page

There comes a scenario that having created a template successfully, you may not be able to find one while crerating a page in project hierarchy. There could be two reasons, either it is in draft state or the template is not allowed in the hierarchy. If it is in draft state, you need to enable it as discussed above but what if we need to allow it in a hierarchy.

Suppose you need to create a page in we-retail site hierarchy with your custom template. Despite being enabled, this custom template is not available in the hierarchy. This is because the template is not allowed in the hierarchy. To allow it, select the page within which you need to allow the template and click on the properties. Here you can see the advance tab. In advance tab, you will find template settings, allowed templates, add the path of the template in the allowed paths and there you go. You have the template available for creatinf the page.



Conclusion

We have successfully created a template and a page out of it. We also have a clear idea of structure, inital content and layout as well as we have a clear idea of where exactly this is stored in the crx/de. We have also understood the creation and configuration of custom template types what content and page policies are how to troubleshood unavailibility of termplates in the hierarchy.

I hope you enjoyed the learing and have found the blog informative.


Shruti Meshram | AEM Developer
LinkedIn Email