레이아웃 적용

By | 2010년 5월 27일

1. 우리는 앞에서 게시판과 페이지를 생성했다. 그러나 앞에서 생성한 아무런 꾸밈이 없는 게시판과 페이지로, 이를 사이트를 적용 운영하기는 다소 무리가 있다. 여기서는 페이지와 게시판 주변에 레이아웃을 적용, 배너 및 로그인 창 삽입 등을 통해 주변부를 꾸미고 메뉴와 같은 기능을 추가하는 방법에 대해 살펴보겠다. 우선 관리자 화면에의 “사이트 설정”에서 “레이아웃”을 클릭한다음 “생성”버튼을 클릭한다.

2. 레이아웃 이름의 콤보박스를 클릭하면 기본으로 제공되는 레이아웃이 보이는데 이 중 “XE 공식 사이트 레이아웃(xe_official)”을 선택한다. 그리고 제목에 “기본레이아웃”이라 입력한다. 참고로 제목은 임의의 이름을 줄 수 있다. 제목을 입력했으면 “다음” 버튼을 클릭한다.

3. 팝업창이 뜨면 “확인” 버튼을 클릭한다.

4. 레이아웃 설정화면이 나오면 각 항목을 적당히 선택한다. 여기서는 상단메뉴와 하단메뉴를 “메인메뉴”로 선택했다. “메인메뉴”는 앞 글(메뉴만들기)에서 만든 메뉴이다. 이는 레이아웃의 상단과 하단에 “메인메뉴”를 출력하도록 설정한 것이다.

5. 팝업창이 뜨면 “확인” 버튼을 클릭한다.

6. 이제 페이지 관리 화면으로 이동한 후 “메인페이지” 설정아이콘을 클릭한다.

7. 페이지 설정화면의 레이아웃 항목의 콤보박스를 클릭하면 위에서 생성한 “기본레이아웃 (xe_official)”이 보이는데 이를 선택한 다음 “저장” 버튼을 글릭한다.

8. 팜업창이 뜨면 “확인” 버튼을 클릭한다.


9. 이제 페이지 관리화면의 페이지 목록에서 “메인페이지”를 클릭하면 페이지가 아래와 같이 변한것을 알 수 있다. 여기서 상단의 메뉴와 하단의 메뉴가 표시되고 있음을 볼 수 있다.

10. 이제 위에서 만든 기본 레이아웃을 “공지사항” 게시판에 적용해보자. 이를 위해 게시판 목록으로 이동한 후 “공지사항” 게시판의 설정 아이콘을 클릭한다.

11. “공지사항” 게시판 설정 화면에서 레이아웃 항목을 “기본레이아웃 (xe_official)”으로 한 후 “등록” 버튼을 클릭한다.

12. 팝업창에 응답한 후 게시판 목록으로 이동 브라우저 제목 “공지사항”을 클릭한다.

13. 그러면 “공지사항” 게시판도 “메인페이지”와 동일한 레이아웃이 적용됐음을 볼 수 있다. 만약 “공지사항”이 아닌 다른 게시판을 클릭해보면 “공지사항”과는 다른 화면을 보게된다. 이는 다른 게시판에는 레이아웃이 적용되지 않았기 때문이다. 다른 게시판에도 “공지사항”과 동일한 레이아웃을 적용하려면 각 게시판의 설정 아이콘을 통해 레이아웃을 적용하면 된다.

답글 남기기

이메일 주소는 공개되지 않습니다.

이 사이트는 스팸을 줄이는 아키스밋을 사용합니다. 댓글이 어떻게 처리되는지 알아보십시오.