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

I played with JSF and worked on a project that has a title / footer / navigation / content panel. The project, however, goes from page 1 to page 2, etc., Moreover, each page has a different layout. How to create a reusable template that retains the same appearance from page to page, i.e. The header / footer / navigation remains unchanged, but is the content updated?

+8
templates facelets jsf jsf-2
source share
1 answer

This sounds like a classic example of a wizard template. In such a template, you put everything that is common to all pages, and then your actual pages link to this template and "fill in the blanks." To some extent this applies to the classic.

eg.

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

The page uses this as follows, for example:

/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> 
+22
source share

All Articles