[JSP] header, footer 넣기

 

헤더 header

홈페이지 제일 상단 부분이다.

네비게이션과 검색파트가 있어 스크롤 상단에 항상 고정되어 있는 경우가 많다.

 

푸터 footer

모든 페이지의 맨 아래, 본문 내용 아래에 위치한 영역이다.

 

헤더와 푸터는 모든 페이지에 동일하게 사용되는 경우가 일반적이므로, 별도의 페이지로 만드는 경우가 많다.

물론 모든 페이지에 복사 붙여넣기를 통해 구현할 수도 있지만, 수정사항이 생길 경우 모든 페이지를 전부 수정해야한다.

당연히 하드코딩으로 인한 휴먼 에러가 증가하기 때문에 별도의 페이지로 만들어 연동하는 것이 좋다.

 

그렇다면 JSP에서 헤더와 푸터를 어떻게 연동해야할까,

 

incloud

<%@incloud %>

 

incloud를 사용하면된다.

 

incloud 속성에는 file이 있는데 해당 file에 header나 footer 파일 경로를 넣으면 해당 위치에 해당 페이지가 연동되어 같이 나타난다.

<%@ include file="headerfooter/header.jsp" %>

 

연동하는 페이지, 즉 header와 footer에 link된 css도 함께 불러와지므로 만약 본문에 사용된 css 설정과 다르다면 css 충돌을 주의해야한다.

(상대경로를 작성할 경우 불러오는 페이지 기준으로 경로를 작성해야한다.)