CODEWITHSUNDEEP
cssjsp
user3131524
user3131524

Reputation: 11

how to use header and footer in web page

this is footer file used in html footeradmin.jsp to see your page nice

        <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
            pageEncoding="ISO-8859-1"%>
        <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
        <html>
        <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <link href="<%=request.getContextPath()%>/css/style.css" rel="stylesheet" type="text/css">
         <script src="<%=request.getContextPath()%>/js/SpryCollapsiblePanel.js" type="text/javascript"></script>
        <script src="<%=request.getContextPath()%>/js/SpryMenuBar.js" type="text/javascript"></script>
        <link href="<%=request.getContextPath()%>/css/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css" />
        <link href="<%=request.getContextPath()%>/css/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="tinybox.js"></script>
        </head>
        <body>        
        </div>
        </div>
        </div>
        </div>
        </div>
        </div>
        <div class="bottom">
        <ul>
          <li style="border-left: medium none;"><a href="nsephome.jsp">Home</a></li>
          <li><a href="aboutusadmin.jsp">About&nbsp;Us</a></li>
           <li><a href="Contactusadmin.jsp">Contact Us</a></li>
          <li><a href="feedbackadmin.jsp">Feedback</a></li>
          <li><a href="index.jsp">Logout</a></li>
           <li><a href="sitemapadmin.jsp">Site map</a></li>
        </ul>
        <p>Copyright &copy; 2013. Designed by <a>****</a></p>
        </div>
        </div>

        </body>
        </html>

this is header file I used in web page headeradmin.jsp use this file to look your web page good 

        <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
            pageEncoding="ISO-8859-1"%>
        <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
        <html>
        <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <title>Header</title>
         <script src="<%=request.getContextPath()%>/js/SpryCollapsiblePanel.js" type="text/javascript"></script>
        <script src="<%=request.getContextPath()%>/js/SpryMenuBar.js" type="text/javascript"></script>
        <link href="<%=request.getContextPath()%>/css/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css" />
        <link href="<%=request.getContextPath()%>/css/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
        <link href="<%=request.getContextPath()%>/css/style2.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/tinybox.js"></script>
        <link href="<%=request.getContextPath()%>/css/tinystyle.css" rel="stylesheet" type="text/css" />
        </head>
        <body>
        <div class="main-out">
        <div class="main">
        <div class="page">
        <div class="top">
        <div class="header">
        <div class="header-top">
        <h1>National <span>Self Employment Program</span></h1>
        <p>Call Us: 987 3478 278</p>
        </div>
        <div class="topmenu">
        <ul>
         <li></li>
          <li><a href="nsephome.jsp">Home</a></li>
          <li><a href="aboutusadmin.jsp">About&nbsp;Us</a></li>
          <li><a href="Contactusadmin.jsp">Contact Us</a></li>
          <li><a href="feedbackadmin.jsp">Feedback</a></li>
          <li><a href="index.jsp">Logout</a></li>
        </ul>
        </div>
        <div style="height:550px; width:980px;margin-top:5px;">
        <div style="height:600px;width:160px;float:left;">
        <div style="width:160px;height:20px;background-color:#708090;float:left;"><FONT color="white"><center><b>Our Services</b></center></FONT></div>
        <%@include file="verticalbar1.jsp"%>
        </div>
        <div style="height:600px;width:20px;float:left;">
        </div>
        <div style="height:600px;width:800px;">

        </body>
        </html>

this page include in headerfile verticalbar1.jsp to see your page nice 

        <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
            pageEncoding="ISO-8859-1"%>
        <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
        <html>
        <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <title>Insert title here</title>
        <link href="<%=request.getContextPath()%>/css/style.css" rel="stylesheet" type="text/css">
        <script src="<%=request.getContextPath()%>/js/SpryCollapsiblePanel.js" type="text/javascript"></script>
        <script src="<%=request.getContextPath()%>/js/SpryMenuBar.js" type="text/javascript"></script>
        <link href="<%=request.getContextPath()%>/css/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css" />
        <link href="<%=request.getContextPath()%>/css/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
        <script src="<%=request.getContextPath()%>/js/bank.js" type="text/javascript"></script>
        <script type="text/javascript" src="tinybox.js"></script>
        </head>
        <body>
        <div id="CollapsiblePanel1" class="CollapsiblePanel" style="float:left;margin-top:5px;margin-bottom:10px;"> 
               <ul id="MenuBar1" class="MenuBarVertical">
                  <li><a  href="empregister.jsp">Create Employee</a>
                  </li>
                  <li><a  href="empupdate.jsp">Read Employee</a>
                   </li>
                    <li><a  href="employee_list.jsp">Employee List</a>
                  <li><a  href="empdelete.jsp">Delete Employee</a>

                  </li>
                  <li><a href="feed1.jsp">Feedbacks</a>
                  </li>
                  <li><a class="MenuBarItemSubmenu" href="#">Opinion poll</a>
                    <ul>
                      <li><a href="SubmitQuestion.jsp" >Post Question</a>
                      </li>
                      <li><a href="showpolling.jsp" >View Opinions</a>
                      </li>
                      </ul></li>

                </ul>

              </div> 
        <script type="text/javascript">
             <!--
        var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1", {contentIsOpen:false});
        var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgRight:"../../../SpryAssets/SpryMenuBarRightHover.gif"});
        //-->
        </script>
        <center>
        <img src="../images/emp2.JPG" alt="emp1" width="170" height="200"></img></center>

        </body>
        </html>

Upvotes: 1

Views: 9930

Answers (2)

Aniket Kulkarni
Aniket Kulkarni

Reputation: 12983

The jsp:include element is processed when a JSP page is executed. The include action allows you to include either a static or a dynamic resource in a JSP file. The results of including static and dynamic resources are quite different. If the resource is static, its content is inserted into the calling JSP file. If the resource is dynamic, the request is sent to the included resource, the included page is executed, and then the result is included in the response from the calling JSP page.
The syntax for the jsp:include element is:

<jsp:include page="includedPage" />

You can include both hearder.jsp and footer.jsp into your verticalbar1.jsp 

..........
.........
<jsp:include page="header.jsp" />
.........
........
.....
<jsp:include page="footer.jsp" />

Related link

Upvotes: 2

Franck
Franck

Reputation: 1394

You should try to use : 

<jsp:include page="..." />

to include the page you want at the top of your "body content" page and at the bottom for the footer.

Upvotes: 1

Related Questions