3.2.4. Creating page container template

Warning

You are looking at documentation for an older release. Not what you want? See the current release documentation.

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">

        <move-apps-permissions>*:/platform/administrators</move-apps-permissions>

        <move-containers-permissions>*:/platform/administrators</move-containers-permissions>

        <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):