Hello - I need your suggestion to implement the header and footer as separate experience fragments in the page. Currently we are using static template which is having iParsys for Header and Footer. The goal is to move to Editable template with minimal changes.
Current static template (header and footer comes inside the body tag:
<head>Loading all the required scripts and meta tags</head>
<body class="homepage" ng-controller="productController">
<div id="site-wrapper">
<div data-sly-include="header.html" data-sly-unwrap></div>
<div data-sly-include="content.html" data-sly-unwrap></div>
<div data-sly-include="footer.html" data-sly-unwrap></div>
</div>
</body>
Below is the sample header.html which has iparsys in it.
<header class="fixed">
<sly data-sly-resource="${'parsysnav' @ resourceType='foundation/components/iparsys'}"/>
</header>
Since the header.html is having an iparsys and iParsys won't work in Editable template, I was thinking to create a new Header editable template for Header XF section and and Footer template for Footer XF separately. Finally I will create a new editable template for body section and will include header -> Body -> Footer
In the new template:
Using XF component - Will load Header XF
Layout Container for Body Section
Using another XF component - Will load Footer XF
Not sure if this is correct approach to implement. Could someone throw some light on this to implement the scenario?
