template

Es la plantilla base de todo el sistema. Indicamos el soporte de idiomas, definimos los css, js, que usaremos en toda la aplicación.

Entrar a la carpeta WEB-INF de la carpeta descomprimida jsftemplate

Copiamos el archivo template.xhtml

Lo copiamos al proyecto dentro de WEB-INF

Archivo de propiedades

Indicamos el paquete donde creamos el archivo messages.

  <h:head>
        <f:facet name="first">
            <f:view locale="#{idiomas.locale}"></f:view>
            <f:loadBundle basename="com.javscaz.tallerjsd.properties.messages" var="msg" />


        </f:facet>

Codigo completo

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:b="http://bootsfaces.net/ui"
      xmlns:p="http://primefaces.org/ui">

    <h:head>
        <f:facet name="first">
            <f:view locale="#{idiomas.locale}"></f:view>
            <f:loadBundle basename="com.javscaz.tallercm.properties.messages" var="msg" />


        </f:facet>
        <title>#{msg['application.title']}</title>
        <!-- Bootstrap core CSS -->

        <link rel="stylesheet" type="text/css"
              href="#{request.contextPath}/resources/bootstrap/css/bootstrap.min.css" />
        <link rel="stylesheet" type="text/css"
              href="#{request.contextPath}/resources/dist/css/AdminLTE.min.css" />
        <link rel="stylesheet" type="text/css"
              href="#{request.contextPath}/resources/dist/css/skins/skin-blue.min.css" />


        <link rel="stylesheet" type="text/css"
              href="#{request.contextPath}/resources/bootstrapcdn/css/font-awesome.min.css" />
        <link rel="stylesheet" type="text/css"
              href="#{request.contextPath}/resources/ionicframework/css/ionicons.min.css" />
        <h:outputStylesheet library="css" name="bootstrap-reset.css"/>
        <h:outputStylesheet library="webjars" name="font-awesome/4.6.3/css/font-awesome-jsf.css" />
        <h:outputStylesheet library="css" name="style-responsive.css"/>
        <h:outputStylesheet library="css" name="pfcrud.css"/>
        <h:outputStylesheet library="css" name="style.css"/>

    </h:head>
    <h:body class="hold-transition skin-blue sidebar-mini">
        <f:view >

            <div class="wrapper">

                <!-- Main Header -->
                <header class="main-header">

                    <ui:include src="/pages/top.xhtml"/> 
                </header>
                <!-- Left side column. contains the logo and sidebar -->
                <aside class="main-sidebar">
                    <!-- sidebar: style can be found in sidebar.less -->
                    <section class="sidebar">
                        <ui:include src="/pages/left.xhtml"/> 
                    </section>
                    <!-- /.sidebar -->
                </aside>

                <!-- Content Wrapper. Contains page content -->
                <div class="content-wrapper">
                    <!-- Content Header (Page header) -->
                    <section class="content-header">

                        <ui:insert name="top">
                            top
                        </ui:insert> 

                    </section>

                    <!-- Main content -->
                    <section class="content">


                        <ui:insert name="content">

                            content

                        </ui:insert>
                        <div id="bottom">
                            <ui:insert name="bottom">

                                <h:form rendered="#{!loginController.loggedIn}">

                                    <b:panel look="danger" title="#{msg['title.accesodenegado']}">

                                        <h:panelGrid columns="2" cellpadding="5">
                                            <p:commandButton class="btn btn-success" action="#{loginController.irLogin}"
                                                             value="#{msg['boton.return']}" ajax="false"/>

                                        </h:panelGrid>
                                    </b:panel>
                                </h:form>
                            </ui:insert>
                        </div>
                    </section><!-- /.content -->
                </div><!-- /.content-wrapper -->

                <!-- Main Footer -->
                <ui:include src="/pages/footer.xhtml"/> 
                <ui:include src="/pages/rigth.xhtml"/> 

                <!-- Add the sidebar's background. This div must be placed
                     immediately after the control sidebar -->
                <div class="control-sidebar-bg"></div>
            </div><!-- ./wrapper -->

            <!-- REQUIRED JS SCRIPTS -->


            <script type="text/javascript" src="#{request.contextPath}/resources/bootstrap/js/bootstrap.min.js"></script> <!-- Correio -->
            <script type="text/javascript" src="#{request.contextPath}/resources/dist/js/app.min.js"></script> <!-- Correio -->

            <br />

        </f:view>
    </h:body>

</html>

Last updated