Editable Templates In AEM

 

EDITABLE TEMPLATES

 

After AEM 6.3, it's recommended that all new Experience Manager Projects use Editable Templates over Static Templates. 

AEM has a new role of template-authors and these authors can create templates dynamically at any time as per the requirement.

Using the Adobe Maven 13 and above archetype project, you have the starting files required to produce Editable Templates. There is no longer a need to create Experience Manager projects by using Static Templates.

 

The following specifies the advantages of editable templates:

 

·         Can be created and edited by your authors.

·         After the new page is created, a dynamic connection is maintained between the page and the template. This means that changes to the template structure are reflected on any pages created with that template

·         Uses content policies (edited from the template editor) to persist the design properties (does not use Design mode within the page editor).

·         Are stored under /conf

 

There are three parts of template editor: 

1. templates: Here all the dynamic templates are contained which are created by template authors.

 

2. policies: There are two types of policies:

Template Level Policy: This policy is used to define client side libraries of all the pages, created from a particular template.

Component Level Policy: These policies are used to define components for a particular responsive grid (parsys)for all the pages created from the template.

 

3. template-types: This is a base template on the basis of which template author creates all its templates at the run time.

 

Structure under /conf folder

 

 

To create the folder using project code, make sure the folder has:

·         /conf/<your-project>/settings/wcm/templates, which holds all editable templates for this project

·         /conf/<your-project>/settings/wcm/policies, which holds all page and component content policies

·         /conf/<your-project>/settings/wcm/template-types, which is like the template of an editable template and is copied over to the template. This is required only if you use OOTB template types.

There are three OOTB template types:

·         /libs/settings/wcm/template-types/html5page

·         /libs/settings/wcm/template-types/afpage

·         /apps/settings/wcm/template-types/coreCmpPage

Creating an Editable Templates

 

A template created with the template editor acts as a container for the components.

In addition, you can define the way the template looks by setting styles

You can also define which components are allowed to be used within the template (and those pages that are based on the template).

 

Steps to create Editable template

1.    Go to http://localhost:4502/aem/start.html -> click on Tools -> select Templates or directly go to

http://localhost:4502/libs/wcm/core/content/sites/templates.html/conf

2.    Click the Create button to create a template.

 

3.    In the Create Template wizard, select the  Empty Page template type and click the Next button.

 

4.    Provide a title (HomeTemplate) and description for your template and click the Create button.

5.    Click Open button to open the template. 

Adding components to the templates

You can define a layout in the new template.

Click on the Policy icon, the first item in the toolbar

 

 

1.    When you click the Policy icon, this action opens the Default dialog. Here you can specify the set of components which are allowed to be placed into the Layout Containers.

 

2.    As of now, specify Layout Container (under General) and the project components (under your project name category).

 

3.    Finally, click the check mark in the top-right corner. 

 

You will now be back in the Template Editor. Drag the Layout Container component from the left panel onto the box labelled Drag components here. Once done, the template looks like the following image.

 Now you need to unlock the Layout container component so that an author can add components to it

You can set a policy for the Layout container that defines which components an author is allowed to use within the Layout container. To set the Policy for the Layout container, click on the Layout container, as shown here.

 Give policy title and select the components from allowed components

 

Before an Experience Manager author can use the template to create pages, you must enable it.

Mouse over the template and click the three dot icon and then select Enable.

 

Enabling the template from the Templates console:

 

·         Setting the status property on the jcr:content node.

·         For example, on:
/conf/<your-folder>/settings/wcm/templates/<your-template>/jcr:content

·         Define the property:

·         Name: status

·         Type: String

·         Value: enabled

 

The below diagram shows how templates, content, and components interrelate:

 

 

Important Note: The big difference between static and editable templates is that once a page is created with the template, no dependency is generated between them, so if the template is modified, it did not affect the pages existing. We only see the changes in a new page created from this template. But with editable templates, the page maintains a reference to the template with which it was created and any changes can be applied instantly in existing pages.

Editable templates retain a dynamic connection to any pages created from them. This ensures that any changes to the template are reflected in the pages themselves.

Create page based on editable template

1.    Go to sites http://localhost:4502/sites.html/content

2.    Select your project Folder 

3.    Click the Create button and select Page.

4.    Click on the HomeTemplate(editable) template to select it. Click the Next button.

5.    Provide title for your page and click on create.

 

AEM 6.5 New Features/Upgrades

 

AEM 6.5 New Features/Upgrades

1.    Java Support – Now from Version 6.5, AEM supports Java 11, as well as the already supported Java 8 with additional switches will need to be added to your command line when starting AEM.

 

2.    Java Content Repository - Apache Jackrabbit Oak 1.10.2 (Latest Version)

 

3.    Quickstart uses Eclipse Jetty 9.4.15 as servlet engine.

 

4.    UberJar - There are now two versions of the Uber jar:

 

 

Uber Jar (Recommended)

<dependency>

    <groupId>com.adobe.aem</groupId>

    <artifactId>uber-jar</artifactId>

    <version>6.5.0</version>

    <classifier>apis</classifier>

    <scope>provided</scope>

</dependency>

Uber Jar with Deprecated APIs 

<dependency>

    <groupId>com.adobe.aem</groupId>

    <artifactId>uber-jar</artifactId>

    <version>6.5.0</version>

    <classifier>apis-with-deprecations</classifier>

    <scope>provided</scope>

</dependency>

 

5.    Online Revision Cleanup – It means estimation, compaction and cleanup of repository now be done when we are running AEM Instance no need to shut down.

 

6.    HTL Changes – Introduced new features (https://github.com/adobe/htl-spec/releases/tag/1.4)

 

7.    New Permissions Management UI for Users and Groups (Directly from Touch UI)

 

8.    Column Views now include the workflow status for pages/assets when applicable.

 

9.    Select all action – This is a quick way to execute an action with all pages/assets in the same folder. The Select All action attempts to perform the action to all pages/assets, not just what has been loaded. A warning dialog will be shown if the action has not been upgraded to handle Bulk Actions

 

10.  New Workflow Model editor - Introduced in 6.4 has been improved to include more operations like Copy and Publish, Variable support in Workflow steps and enhanced OR and AND splits.

 

11.  Direct in-place upgrade to AEM 6.5 is supported for customers running AEM 6.2, 6.3 and 6.4.

 

12.  Adobe Asset Link – Now a creator who is working in the Adobe Creative Cloud Applications like Photoshop, Illustrator, or InDesign has an option to connect to AEM Assets using Adobe Asset Link

 

13.  SPA Editors are more powerful in AEM 6.5 with multi-site management as follows:

First shipped as part of AEM 6.4 SP2, with AEM 6.5 the SPA support gains following capabilities:

·         Use Template Editor to edit and configure the AEM editable parts of the SPA

·         Use Multi-site Management to create country, franchise or white-labeled SPA experiences 

14.  Smart Crop for Images/Videos

      Adobe Sensei based Smart Crop features allow you to smart crop all your images/Videos      automatically within the Experience Manager. There is no need for any other tool.

15.  Visual Search - Visual search is an Adobe Sensei powered search capability to find visually similar assets in the DAM.

     Adobe Sensei powers intelligent features across all Adobe Products to dramatically improve the design and delivery of the digital experience using Artificial Intelligence, Machine Learning, and Deep Learning.

     Visual Search is also powered by Adobe Sensei, which identifies the content and composition of your image — and automatically adds Meta Tags to instantly deliver search results based on the visual information.

     You don’t need to translate a visual to text to search. You simply need to drag and drop an image into the search bar and Visual Search will tag, search, and deliver similar images.

16.  Headless Content Delivery:

A headless CMS decouples or separates the back- end functions from the front-end presentation function. It lets developers render content objects for any application or device.

Headless CMSs retrieve raw content as data through API calls and enable developers to build as many front-ends or “heads” as your various channels support.

 

17.  Migrating to Oak Segment Tar - Only the new Oak Segment Tar is supported after AEM 6.3.

In AEM 6.3 changes to the storage format were needed, especially for improving the performance and efficacy of Online Revision Cleanup. These changes are not backwards compatible, and repositories created with the old Oak Segment (AEM 6.2 and previous) must be migrated.

Additional benefits of changing the storage format:

·         Better scalability (optimized segment size).

·         Faster Data Store Garbage Collection.

·         Ground work for future enhancements.

 

18.  Livecopy Overview UI provide an instant view of the status, replacing the Blueprint Control Center.

 

19.  Upgrades on spam detection engine that has been provided to filter out unwanted user generated content on community sites and groups.

 

 

20.  If you are running Oracle Java 11 (or generally versions of Java newer than 8), additional switches will need to be added to your command line when starting AEM.

 

 

21.  Search in Oak now supports dynamic facets. For example the filter rail in assets search show the estimated amount of results.

 

22.  Security Feature: Added Password expiry for admin user.

 

 

23. Adobe is deprecating the Coral UI 2 components in 2019. From AEM 6.4, it is completely based on Coral UI 3 (introduced with AEM 6.2). Adobe recommends its customers and partners that have build custom UIs with Coral 2 to refactored these to Coral 3 using Dialog conversion tool.