Spring MVC 4 – Layout Web dengan SiteMesh

Salah satu hal yang mendasar dalam pengembangan aplikasi web adalah bagaiamana tata letak file dapat diatur dengan mudah, misalnya bagaiamana mengatur kombinasi antara konten static seperti header dan footer dengan konten dinamis sehingga programmer dapat mudah dalam implementasi layout web. Bagi anda programmer web berbasis Java maka solusi template engine untuk mengatur layout halaman web adalah menggunakan library SiteMesh

Berikut tahapan integrasi Spring MVC Framework dengan SiteMesh

  1. Pastikan anda telah download sitemesh-x.x.jar dari website sitemesh.org, dan buat direktori WEB-INF/lib, kemudian letakan file sitemesh-x.x.jar dalam direktori ini
  2. Tambahkan setingan Filter sitemesh dalam file web.xml web anda
    <filter>
            <filter-name>sitemesh</filter-name>
            <filter-class>com.opensymphony.sitemesh.webapp.SiteMeshFilter
                </filter-class>
        </filter>
    
        <filter-mapping>
            <filter-name>sitemesh</filter-name>
            <url-pattern>/*</url-pattern>
        </filter-mapping>
    
  3. Buat file konfigurasi sitemesh pada file WEB-INF/decorators.xml, dan berikut isi skripnya
    <?xml version="1.0" encoding="UTF-8"?>
    <decorators defaultdir="/WEB-INF/jsp">
        <decorator name="layout1" page="layout1.jsp">
            <pattern>*</pattern>
        </decorator>
       <decorator name="no" page=""></decorator>
    </decorators>
    
  4. Berikut buat file template layout web anda : WEB-INF/jsp/layout1.jsp
    <?xml version="1.0" encoding="UTF-8" ?>
    <%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator"
            prefix="decorator" %>
    <!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></title>
    </head>
    <body>
        <h1>Header : ROJULMAN.COM</h1>
        <p><b>Navigation</b></p>
        <hr />
        <decorator:body />
        <hr />
        <h1>Footer : Develop By @rojulman </b></h1>
    </body>
    </html>
    
  5. Buat controller, pastikan anda telah mengikuti tutorial ini: Spring MVC Controller untuk membuat controller HomeController dan halaman salam
  6. Akses halaman web anda : http://localhost:8080/project_anda/home/salam.htm

Selamat mencoba

Post a Response