How to create a reuseable template with header/footer/navigation?

templates jsf jsf-2 facelets
user1111928 picture user1111928 · Apr 1, 2012 · Viewed 14.1k times · Source

I have been playing with JSF and have a project working that has a header/footer/navigation/content panels. The project, however, goes from page 1 to page 2, etc., with each page having a different layout. How can I create a reusable template that keeps the same look and feel from page to page, i.e., header/footer/navigation stay the same, but content is updated?

Answer

Arjan Tijms picture Arjan Tijms · Apr 1, 2012

This sounds like a classic case of a master template. In such a template you put everything that's common to all pages and then your actual pages reference this template and "fill in the blanks". In a way it's the reverse of the also classic include.

E.g.

/WEB-INF/templates/masterTemplate.xhtml:

<!DOCTYPE html>
<html lang="en"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets" 
>
    <h:head>
        <title>
            <ui:insert name="title">Some title</ui:insert>
        </title>        
    </h:head>

    <ui:include src="header.xhtml"/>

    <h:body>
        <ui:insert name="content" />
    </h:body>

    <ui:include src="footer.xhtml"/>

</html>

A page uses this as follows, e.g.

/hello.xhtml

<ui:composition template="/WEB-INF/templates/masterTemplate.xhtml"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets" 
>
   <ui:define name="title">hello</ui:define>

    <ui:define name="content">
        Hi, this is the page
    </ui:define>
</ui:composition>

Related questions

JSF/PrimeFaces - Template with <p:layout>

I need to create a layout like this but with all the containers on separated files, like: top.xhtml <p:layout fullPage="true"> <p:layoutUnit position="north" header="#{support.applicationTitle}"> <h:form> <p:…

Read More
How can I echo HTML in PHP?

I want to conditionally output HTML to generate a page, so what's the easiest way to echo multiline snippets of HTML in PHP 4+? Would I need to use a template framework like Smarty? echo '<html>', "\n"; // …

Read More
How to use Class<T> in Java?

There's a good discussion of Generics and what they really do behind the scenes over at this question, so we all know that Vector<int[]> is a vector of integer arrays, and HashTable<String, Person> is …

Read More