레이아웃 제작에 있어 초보분들을 위해 작성을 해보았는데
텍스트 위주라 작성해놓고 보니 보기가 상당히 힘드네요.
그냥 폐기처분 할려다 올려봅니다.


* 존칭은 생략합니다. 양해바랍니다.


1. 기본구성요소 작성 : 토시하나 틀리지 말고 믿음으로써 따라하면 5분만에 zbxe(이하 xe 또는 XE) 레이아웃이 제작된다!!


윈도우즈에서 일단 디렉토리와 파일을 생성한 후 ftp를 이용해 계정에 업로드 하도록 한다.

간단히 요약하자면 디렉토리 2개 파일 2개만 생성하면 레이아웃이 제작된다.

- chochobo 디렉토리를 만든다.
- chochobo  디렉토리 밑에 conf 디렉토리를 만든다.
- chochobo/conf 디렉토리 밑에 info.xml 파일을 만든다.
- chochobo 디렉토리 밑에 layout.html 파일을 만든다.

다시 말하면,
chochobo                 (디렉토리생성) - 만들 레이아웃의 영문명 (아무거나 영문으로 정한다.)
        conf - info.xml  (디렉토리와 파일생성) - 디렉토리명(conf)과 파일명(info.xml)이 절대 똑같아야 한다.
        layout.html       (파일생성) - 파일명(layout.html)이 절대 똑같아야 한다.


자세히 작성해보죠..

1) 꼭 필요한 디렉토리 생성 : 위와 같다.

 

2) 꼭 필요한 파일 생성

    - 빈 문서에 아래의 내용을 복사해서 입력하고 chochobo/conf  디렉토리 밑에 info.xml 으로 저장한다. utf-8형식으로 저장한다. info.xml은 레이아웃의 환경설정 파일이라고 생각하면 된다. 레이아웃에 대한 정보를 갖고 있으며 관리자 페이지에서 레이아웃에서 사용할 타이틀을 설정하고 연결할 메뉴를 지정할 수 있게 해주고 로고이미지도 올리게 할 수 있다. 이런 부분들은 차츰 배워가도록 한다.

<?xml version="1.0" encoding="utf-8"?>
<layout version="0.1">
    <title xml:lang="ko">초초보 레이아웃</title>
    <author email_address="제작자이메일주소" link="제작자홈페이지주소" date="제작일">
        <name xml:lang="ko">제작자이름</name>
        <description xml:lang="ko">
            초초보의 레이아웃입니다.
        </description>
    </author>
    <menus>
        <menu name="main_menu" default="true">
            <title xml:lang="ko">메인 메뉴</title>
            <maxdepth>3</maxdepth>
        </menu>
    </menus>
</layout> 


   대충 살펴보면,




    - 다시 빈 문서 하나를 불러와서 아래의 내용을 입력하고 chochobo 디렉토리에 layout.html 파일명으로 저장한다. 파일형식은 utf-8 로 저장하자. layout.html 파일에는 헤더와 푸터를 합친 <body></body>사이의 내용이 들어간다. layout.html 에는 <html><head><title><body> 등 기본적인 태그를 사용하지 않는데 이는 zbxe에서 기본적으로 제공 해주기 때문이다.
위에 기본적인 태그는 이제 손아프게 적지 않아도 된다. <body> </body> 사이에 들어가는 내용만 작성하면 되는 것이다.

 

<h1>초초보의 레이아웃입니다.!!</h1>


   위 한 줄 넣으시라. 여기까지 했으면 가장 기본적인 레이아웃 제작은 끝이다.

3) 계정의 zbxe/layouts/ 디렉토리에 chochobo 디렉토리를 ftp로 업로드한다.
     이제 xe를 이용해서 우리 초초보가 만든 레이아웃을 화면에 나타나게 해보자.


 

2. 초초보 레이아웃 적용하기

(1) xe로 사이트를 구축하는 순서 (간단히...)


   1) 사 이 트  구상   : 
"홈, 자유게시판" 이렇게 두 개의 메뉴를 가진 사이트를 만든다. 처음 접속하거나 홈을 눌렀을 때 공지사항 게시판을 보여주겠다.


   2) 게 시 판 생성 :
공지사항, 자유게시판에 연결할 두 개의 게시판을 생성한다. 
공지사항 게시판을 생성할 때는 "선택하시면 사이트에 mid값 없이 접속하였을 경우 기본으로 보여줍니다"에 꼭 체크하자.


   3) 메        뉴 생성 :
"초초보메뉴"로 메뉴를 하나 생성하고 홈, 자유게시판 딸랑 두개의 메뉴를 생성한 후 공지사항게시판, 자유게시판을 각각의 메뉴에 연결한다.


   4) 레이아웃  생성 
레이아웃 이름 : "chochobo(초초보 레이아웃)" 를 선택하고,
제                  목 : "초초보 레이아웃 도전"   정도로 작성하고 다음 버튼을 클릭한다.
-> 메인 메뉴(main_menu) 선택하는 곳에서는 앞서 만든 초초보메뉴를 선택한다.
"체크를 하시면 연결된 모든 메뉴의 모듈 레이아웃을 일괄 변경합니다."에 꼭 체크하고 마지막으로 저장 버튼을 꾹~ 눌러주자.


 

(2) xe로 만든 사이트에 접속
- 사이트에 접속해서 "초초보 레이아웃입니다." 라는 문구가 화면상에 뜨면 레이아웃 제작에 성공한 것이다.
이제부터는 layout.html의 내용만 바꾸면 그 내용이 모두 화면에 출력된다.



------------------------ 첫번째 내용은 여기까지 입니다.


다음회에는 info.xml에서 타이틀이나 로고이미지 등을 추가로 설정하고 이것을 layout.html에서 출력하는 방법과
이미지 사용법, 자바스크립트와 css파일 사용방법에 대해서 알아보겠습니다.

마지막으로는 게시판 등 본문내용을 출력하는 방법과 메뉴 다루는 방법에 대해 알아보겠습니다.

이 게시물을..