Tenho um arquivo de template e outra página JSF qualquer, como mostrado abaixo.
Template.xhtml
<jsp:root version="2.1"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:jsp="http://java.sun.com/JSP/Page"
xmlns:webuijsf="http://www.sun.com/webui/webuijsf">
<f:view>
<webuijsf:page id="pageMenu">
<webuijsf:html id="htmlMenu">
<webuijsf:head id="headMenu">
<webuijsf:link id="link1" url="/resources/stylesheet.css"/>
</webuijsf:head>
<webuijsf:body focus="formMenu:tabSet1" id="bodyMenu" style="-rave-layout: grid">
<webuijsf:form id="formMenu">
<webuijsf:menu id="menu1" items="#{Menu.menu1DefaultOptions.options}" style="position: absolute; left: 72px; top: 72px; width: 120px; height: 48px"/>
<h:commandLink action="#{Menu.linkClientes_action}" id="linkClientes" style="left: 24px; top: 48px; position: absolute" value="Clientes"/>
<h:commandLink action="#{Menu.linkUsuarios_action}" id="linkUsuarios" style="left: 24px; top: 96px; position: absolute" value="Usuários"/>
<h:commandLink action="#{Menu.linkModulos_action}" id="linkModulos" style="left: 24px; top: 144px; position: absolute" value="Módulos"/>
<h:commandLink action="#{Menu.linkEngines_action}" id="linkEngines" style="left: 24px; top: 192px; position: absolute" value="Engines"/>
<h:commandLink action="#{Menu.linkTransacoes_action}" id="linkTransacoes" style="left: 24px; top: 240px; position: absolute" value="Transações"/>
<h:commandLink action="#{Menu.linkMenus_action}" id="linkMenus" style="left: 24px; top: 288px; position: absolute" value="Menus"/>
<h:commandLink action="#{Menu.linkMenus_action}" id="linkProdutos" style="left: 24px; top: 336px; position: absolute" value="Produtos"/>
</webuijsf:form>
</webuijsf:body>
</webuijsf:html>
</webuijsf:page>
</f:view>
</jsp:root>
CadastroDeCliente.jsp
<jsp:root version="2.1"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:jsp="http://java.sun.com/JSP/Page"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:webuijsf="http://www.sun.com/webui/webuijsf">
<jsp:directive.page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"/>
<ui:composition template="./templates/Template.xhtml">
<ui:define name="conteudo">
<f:view>
<webuijsf:page id="pageCadastroDeCliente">
<webuijsf:html id="htmlCadastroCliente">
<webuijsf:head id="headCadastroCliente">
<webuijsf:link id="linkCss" url="/resources/stylesheet.css"/>
</webuijsf:head>
<webuijsf:body id="bodyCadastroCliente" style="-rave-layout: grid">
<webuijsf:form id="formCadastroCliente">
<h:panelGrid id="gridPanelCadastroCliente" style="height: 24px; left: 24px; top: 528px; position: absolute" width="144">
<h:commandButton action="#{CadastroDeCliente.btnSalvar_action}" id="btnSalvar" style="height: 24px; width: 120px" value="Salvar"/>
</h:panelGrid>
<h:inputText id="txtNome" required="true" style="height: 24px; left: 144px; top: 72px; position: absolute; width: 144px" value="#{CadastroDeCliente.cliente.nome}"/>
<h:inputText id="txtDominio" required="true" style="height: 24px; left: 144px; top: 96px; position: absolute; width: 144px" value="#{CadastroDeCliente.cliente.dominio}"/>
<h:selectBooleanCheckbox id="ckbAtivo" style="height: 24px; left: 120px; top: 120px; position: absolute; width: 24px" value="#{CadastroDeCliente.cliente.ativo}"/>
<h:outputText id="lbltAtivo" style="height: 24px; left: 144px; top: 120px; position: absolute; width: 96px" value="Ativo"/>
<h:outputText id="lblNome" style="position: absolute; left: 24px; top: 72px; width: 120px; height: 24px" value="Nome"/>
<h:outputText id="lblDominio" style="position: absolute; left: 24px; top: 96px; width: 120px; height: 24px" value="Domínio"/>
<h:outputText id="lblProdutos" style="position: absolute; left: 24px; top: 168px; width: 120px; height: 24px" value="Produtos"/>
<h:selectManyListbox id="multiSelectListboxProdutos" style="position: absolute; left: 144px; top: 168px; width: 384px; height: 312px" valueChangeListener="#{CadastroDeCliente.multiSelectListboxProdutos_processValueChange}">
<f:selectItems id="multiSelectListbox1SelectItems" value="#{CadastroDeCliente.produto}"/>
</h:selectManyListbox>
</webuijsf:form>
</webuijsf:body>
</webuijsf:html>
</webuijsf:page>
</f:view>
</ui:define>
</ui:composition>
</jsp:root>
Como de praxe, estou utilizando o componente Woodstock da Sun (por causa do Netbeans).
O problema ocorre na renderização das páginas, pois o cabeçalho da página JSP se repete, ‘zoando’ o layout.
<!-- início do Template.xhtml -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Protótipo
</title>
<style type="text/css">
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
}
.header {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 18px;
}
.bottom {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
text-align: center;
vertical-align: middle;
color: #8E969D;
}
</style>
</head>
<body bgcolor="#ffffff">
<!-- início da página JSP -->
<jsp:root version="2.1" xmlns:jsp="http://java.sun.com/JSP/Page"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:wairole="http://www.w3.org/2005/01/wai-rdf/GUIRoleTaxonomy#" xmlns:waistate="http://www.w3.org/2005/07/aaa">
<head>
</body>
</html>
<!-- fim da página do Template -->
Como faço para corrigir isso?