One of the problem that we see after using editable templates is referring the same header and footer in multiple templates.
Prerequisite : Developer should have knowledge of Editable Templates.
In legacy template development, we use the create a basepage template where we embed the header and footer nodes. Any template that inherit base page templates render the header and footer without re-authoring.
In latest AEM versions where Editable Templates comes in picture, we encounter with two terms related with templates.
- Template Types
- Templates
Here every template is a separate entity and does not inherit from other template rather inherit from Template Types.
To create a relation between two components or share the components we can use two approaches :
- Include the content resource in your template script file.
- Use the content fragment.
Below are the common steps to create basepage and homepage templates.
Step 1 : After setting up vanilla AEM
project, we can see ContentPage template is already present
Step 2 : Create a new template say base-page template using empty
page template type.
Step 3 : Configure the base-page template with Header and Footer as
shown below.
Step 4 : Publish the template.
Step 5 : Create another template say homepage template from empty page
template type as we created for base page.
Now user must see header and footer on homepage template
without re authoring.
Approach 1 :
·
Inject the content resource in body.html with
specific condition.
<sly data-sly-resource="${ @path='/conf/aemcorner/settings/wcm/templates/base-page/structure/jcr:content/root/header', wcmmode='disabled'}"/>
Please refer the page component from the
repo
Approach 2 :
Use content fragments. (Yet to publish)
Github Repo (Full Code Access ):
https://github.com/vivekdhiman/aemblogs.git
Thanks,
