Note: This is first in the series of blogs we are coming up with editable templates. The next blogs will contain advanced development concepts like - How to create custom editable templates and associating a style system with editable templates.
Introduction to editable templates in AEM
AEM introduced the concept of Editable templates which can be owned by template authors. This reduces the one of the tasks of AEM developers as these authors doesn't need AEM development knowledge. Even though the responsibility of creating styles and scripts (clientlibs) lies with developers, template authors can create new templates and consume these predefined clientlibs. Template authors can modify the templates, enable/disable the components to be used on a template and change the client libraries to be loaded on these templates.
Creating Editable Templates from OOTB types
By default, editable templates will be created under /conf folder. To create a editable template,
1. Using AEM web interface, go to Tools --> General --> Configuration Browser --> Create Configuration --> Title should be project name (Eg: digitalect) and select editable templates checkbox.
2. By default, the following folder structure will be created - templates, policies and template-types are the building blocks for editable templates.
3. The functionality of these three nodes are as follows:
templates - Stores all editable templates of a project.
policies - Stores component level and template/page level policies.
template-types - Stores base templates that editable templates under "templates" folder can extend. This will not have any impact if we are not using OOTB editable template types.
4. To view the OOTB template types, navigate to Tools --> General --> Templates --> digitalect (project-name) --> Create. This will allow user to select the base template to extend -
5. Selecting a OOTB template type and clicking on "Create" button will create a template
6. To create pages from of this template, it has to be enabled as below
7. OOTB, editable templates will have 3 modes -
Structure (default) - Define the components and content which cannot be edited by page authors.
Initial Content - Define default content that will come up when a page is created using this template but this can be edited/removed by page authors.
Layout - Defines layout for a range of devices (similar functionality as in static templates.)
Creating pages using Editable templates
1. To create a page using editable template (same as static templates), it has to be enabled for specific path. It can be done in a similar way as we do for static templates i.e., by enabling the templates in page properties -
2. Create a page and select the newly created editable template - Navigate and create at http://22.214.171.124:4502/sites.html/content/digitalect-editable-templates/editable-pages
3. The pages created using editable and static templates will have same features/behaviour except design mode i.e., when a page is created using editable template, it will not have a design mode option. The enabling/disabling of components will be handled through configurations at /<your-template-name>/structure.
Enable/Disable components on a editable template
1. To enable a component, open template in 'structure' mode and select Layout Container and click on "Policy Icon".
2. Policy configurations will displayed as below - Components can be allowed under "Allowed Components" tab under Properties section.
3. Even though components are allowed, page authors will not be able to author these components until the layout container is unlocked. Template authors will have capability to lock or unlock particular layout container (parsys).
Only when a layout container is unlocked, page authors can drag and drop allowed components.
Default components on pages using editable templates
To make sure specific components are available on pages created using a editable template, 1. Open the template in "Initial Content" mode and author the component.
2. Pages created after the components gets authored in Initial Content of template will contain these components by default. Page authors can edit the content/remove component as well.
3. If template author placed a Title component on template, then the page will inherit this content when created using this particular template.