March 16, 2020
Estimated Post Reading Time ~

Template types in AEM

Adobe Experience Manager is the best CSM, which is backed by OSGi, JCR, and jackrabbit like framework, which makes it advance and best CSM solution. Adobe Experience Manager gives a solution for content-oriented Web-applications.

Other technologies like Dev-ops also back it up in order to manage load balancing and provide additional security. Configuring dispatcher in AEM is One of them, which gives all such kind of availability that makes it more powerful.
There is another powerful concept of Templates, ie static templates and editable templates in aem which makes it awesome. So let’s start

What is Templates in AEM
A template is like a base page on which the components are stuffed, components are basically html, CSS and js code. In order to create a new page, the template is used and it acts as the base of the new page. The template basically defines the structure of the page(Initial content and components that will be used).

There are basically two types of Templates in AEM:
1. Static Template
2. Editable Template

Static Templates in AEM
Static templates are available for almost all of the versions of AEM. Static templates are defined and configured by developers. There is no dynamic connection between page and template. Static templates are stored under /apps folder. In static templates, design mode is available for defining properties.

Now let’s see how static templates are created:
1. Go to crx console
2. Now under your project folder i.e., present in /apps folder create a new folder naming Template, right-click on it and select Create Template option.
3. Now we will see a prompt there, fill out the following information: Label: content page
Title: My project content page
Description: The content page for Yourprojectname
Resource Type: Yourprojectname/components/page/contentpage Ranking: It defines the position of the template like 1 would mean in the first position.
4. Now click on Next, then you’ll be asked to define Allowed Paths, type /content(/.*)? in it because it is used for looking templates and click Next button.
5. Now you’ll see allowed children prompt, skip it and click on Ok and then Save All button.

Note: We can also specify Allowed Paths this way /content/Yourprojectname/en/* for a specific project.
What is Editable templates in AEM
Templates are mainly used in Adobe Experience Manager 6.4 onwards and considered as the best practice. They can be created and edited by authors. There remains a dynamic connection between the page and template after page creation which allows changes to reflect on pages also if any made on the template. These templates are stored in /conf folder. The editable template allows authors to lock or unlock content for controlled access by Page Authors.

Now let’s see how Editable templates in aem are created: Editable templates can be created automatically when we create project structure from Maven.

We can also create our own customized Editable Template without using maven in the following way:
Step 1: Go to the configuration browser and select tools>Templates>YourProject>Create and choose the type of template(use HTML5).Step 2: Now name the template and click to open the created template.Step 3: Now Enable the template by selecting a template(Created Template) from Templates console and select enable from the toolbar.Step 4: Now in order to use created Editable template to our pages, we have to add the template path to a page in the following manner:
a. Select your page and open the root page from the site Admin.
b. Go to page properties > Advanced > Template settings.
c. Add Allowed templates and paste /conf/Yourprojectname/settings/wcm/templates/.* (this is the path of current created Templated)


By aem4beginner

No comments:

Post a Comment

If you have any doubts or questions, please let us know.