Page container templates are Groovy ones that are used for (but not limited to) page decoration. You can re-use the built-in templates or write your own templates and package them in the site-extension.
By declaring a template in pages.xml, you decorate the individual pages. By declaring a template in portal.xml, you make the site layout that impacts all the pages of the site.
You can learn some templates in portal.war!/groovy/portal/webui/container/
. In this tutorial the templates are
not much more than this code:
<%uicomponent.renderChildren();%>
Add the templates to your site extension so that it contains:
Edit portal.xml
to make the site layout:
<portal-layout>
<container id="MySiteLayoutContainer" template="war:/groovy/container/MySiteLayoutContainer.gtmpl">
<page-body> </page-body>
</container>
</portal-layout>
Edit pages.xml
to place the Getting Started portlet into a container:
<page>
...
<container id="MyPageContainer" template="war:/groovy/container/MyPageContainer.gtmpl">
<portlet-application>
<portlet>
<application-ref>homepage-portlets</application-ref>
<portlet-ref>GettingStartedPortlet</portlet-ref>
</portlet>
<title>Getting Started</title>
<access-permissions>*:/platform/users</access-permissions>
<show-info-bar>false</show-info-bar>
<show-application-state>false</show-application-state>
<show-application-mode>false</show-application-mode>
</portlet-application>
</container>
...
</page>
Edit MySiteLayoutContainer.gtmpl
:
<div style="background-color: navy; font-size: 18px; padding: 15px; color: white"> <span>ACME Intranet</span> </div> <div> <%uicomponent.renderChildren();%> </div> <div style="text-align: center; background-color: wheat; border-bottom-left-radius: 7px; border-bottom-right-radius: 7px"> <span style="font-style: italic">Powered by eXo Platform</span> </div>
Edit MyPageContainer.gtmpl
:
<div style="border: 3px solid deepskyblue"> <%uicomponent.renderChildren();%> </div>
After redeploying the site extension, test the decoration of the page (navy and wheat blocks for site layout, and the blue border for the page container):