이런 경우외에도 메뉴는 있는데 모듈이 연결이 되지 않았으면 mid 값이 없기 때문에 home 메뉴로 이동하게 된다.
본 설명은 기본형태의 홈페이지 구조를 바탕으로 한 것이며, 반드시 이렇게 해야 하는것은 아니다.

이러한 기능을 이용하여 다양한 구성을 할 수도 있다. (개인의 상상력에 따라 ^^)

자..정리를 해보자.
home 이란 메뉴는 home이란 페이지 모듈이 연결되어 있고, home 페이지 모듈은 site3_main 이란 메인용 템플릿이 적용되어 있다. 

이제 메인페이지에 최근 게시물과 같은 위젯을 추가해서 꾸며 보도록 하자.

1. 페이지 수정버튼을 눌러 페이지관리 화면으로 들어가 보자.
   

2. 아래와 같은 페이지관리 화면을 볼 수 있을 것이다.
   

3. 메인페이지에 최근게시물 형태의 위젯을 추가해보자.
    (위젯추가는  최근문서, 최근댓글, 최근 이미지를 한번 출력해 보도록 하겠다.)
    ⑴ 공지사항을 뽑아내 보자.(최근문서출력 위젯)
    ⑵ 고객문의를 뽑아내 보자.(최근문서출력 위젯)
    ⑶ 최근 이미지를 출력해보자.(최근이미지 출력 위젯)
    ⑷ 최근댓글을 출력해 보자.(최근댓글위젯)
    -----------------------------------------------------------------------
    여기까진 페이지에서 출력하는 형태이고, 직접 레이아웃에 출력하는 것으로 레이아웃 좌측 로긴 하단 공간에 
    ⑸ 달력출력
    ⑹ 기본카운터위젯 출력

    이렇게 메인화면을 한번 꾸며 보도록 하겠다.

    ⑴ 공지사항을 뽑아내 보자.(최근문서출력 위젯)

    - 1번 : 스킨을 지정해 줄수 있다. 현재 xe공식레이아웃용 최신글 스킨을 시범적으로 선택해서 처리해 본다.
              향후 많은 유저들이 새로운 스킨을 제공할때 다운 받아 스킨폴더에 업로드한후 자신이 원하는 것을 마음대로 골라서 사용 할 수 도 있겠다.
    - 2번 : 대상모듈을 지정해주는 공간이다.
              현재 첫번째로 공지사항을 최신글 형태로 메인에 뽑아내 보려고 하는데 그러기 위해선 대상모듈에서 notice(공지사항)을 선택하면 된다.
              즉, 자신이 메인화면에 뽑아내고자 하는 모듈을 선택해주면 된다.
              *** 필수 체크팁  !!!  
              여기에서 눈치 빠르신 분들은 이미 감을 잡으셨으리라 생각되는 부분이 체크를 여러개 하면 어떻게 되는가 이다.
              그렇다. 체크를 여러개 한다면 그 체크가 된 모듈들을 대상으로 최근 게시물을 뽑아 올 수 있다.
               잘 활용하면 다양한 형태의 컨텐츠 구성이 가능할 것이다.
               아쉬운건....
               한번에 모든 모듈을 선택하는 전체선택 기능과(모듈이 100개라면 100번을 체크해야 할 상황이 생길수도 있는것이다. ㅡ.ㅡ;;)
               페이징기능과  모듈검색기능이 제공되면 좋겠다는 생각이다.

    - 3번 : 제목글자수를 지정해 줄수 있다. 
              즉, 화면상에 너무 긴 제목의 경우 다른공간으로 넘어가거나 개행이 되는데 몇글자까지만 보여 줄것인지 정해주는 것이다.
    - 4번 : 위젯(widget)의 상하좌우 여백을 조정해 줄 수 있다. 홈페이지를 꾸미다 보면 각 컨텐츠의 구분의 위해 여백설정이 필요하다.
                현재 첫번째 위젯을 좌측정렬을 할것이기 때문에  우측에 올 위젯과의 여백을 생각해서 15px정도를 지정해 주었고, 
                아래쪽 여백을 15정도 지정해 주었다.
    - 5번 : 크기고정을 선택해 주면 아래쪽에 가로크기 부분에서 지정한 크기대로 사이즈가 고정된다. 일단체크...
    - 6번 : 위젯의 크기를 지정해 주는데 현재 메인화면에서 좌측, 우측 플러그인을 대칭적으로 배치하려고 생각하기 때문에 50%를 지정해 주었다.
    - 7번 : 위치는 먼저 좌측에 배치를 하고 그다음 위젯을 우측에 배치에서 대칭적으로 구성하려고 한다. 먼저 왼쪽을 선택
    - 8번 :  지금껏 설명한 내용과 기타 기본적인 값들을 지정하고 나서 코드 생성을 클릭하면 페이지관리창에 지금설명한 위젯소스가 추가가 되고 아래와 같은 
                  화면을 만날수 있을 것이다.
    
   
    이렇게 페이지관리에 위젯이 추가 되었고, 해당 위젯을 수정하려고 하면 더블클릭을 하면 다시 수정창이 뜨게 된다.
    페이지관리에서 저장 한 다음 메인페이지를 한번 확인해 보자.
   

    이젠 뭔가 거의 다 된듯한 느낌이다.
    그런데 왜 게시물이 하나도 안보이는걸까? 
    당연히 공지사항에 게시물을 하나도 작성하지 않았기 때문에 안보이는 것이다.
    게시물을 작성하게 되면 아래와 같이 리스트가 출력 되게 된다.
   

    ⑵ 고객문의 게시판에서 최근게시물을 뽑아서 공지사항 우측에 출력 시켜 보자.
        출력시키는 방법은 동일하다. 단지 설정에 있어서 
        좌측 여백 : 15px
        하측 여백 : 15xp
        사이즈 고정에 체크
        사이즈 : 50%

        위치 : 오른쪽  
        이렇게 설정해 주면 된다. 물론 고객문의 모듈을 선택해야 하고, 스킨기나 기타 값들도 알맞게 지정해 주어야 한다.
      

    공지사항과 고객문의 위젯의 배치에 관련된 설정값을 두개 비교해서 아래에 보여주도록 하겠다. 이해에 도움이 되길..

    * 공지사항 
       우측 여백 : 15px
       하측 여백 : 15xp
       사이즈 고정에 체크
       사이즈 : 50%

       위치 : 왼쪽  
    * 고객문의
      좌측 여백 : 15px
        하측 여백 : 15xp
        사이즈 고정에 체크
        사이즈 : 50%

      위치 : 오른쪽  

   두개의 위젯이 좌측과 우측으로 각각 50%씩 공간을 차지하면서 중간 여백이 30PX로 지정된것을 아래와 같이 확인 할 수 있다.
      
   
   공지사항과 고객문의 두개의 위젯이 정상적으로 화면에 출력이 되었다.
   위젯두개 출력시켰는데 벌써 느낌이 다르게 느껴지는군...

   *** 필수체크 팁 !!!
   페이지관리에서 위젯을 나타내는 녹색그라데이션부분을 클릭하면 크기를 변경 시킬 수 있는데 여기서 크기를 변경한다고 해서 화면상에 출력되는
   위젯의 사이즈가 변경되는 것은 아니다. 
   

  1번이 공지사항이고 2번이 고객문의 인데 지금 위 화면에선 크기가다르게 되어 있다.
  즉, 이렇게 크기가 다르게 되어 있더라고 홈페이지 화면상에서는 아래와 같이 출력이 된다는 것이다.
  위젯 사이즈에 대한 조정은 위젯 설정화면에서만 변경이 가능하다.
     
  
 대신 페이지관리에서 위젯들을 좀더 정렬된 상태로 보기 위해 해당 위젯들을 클릭해서 사이즈와 줄을 좀 맞춰서 보기 좋게 지정해 둘수가 있다.
  
  위에 정렬 안된것보다 이렇게 정렬된것이 보기 좋지 아니한가..? ^^

  ⑶ 최근 이미지를 출력해보자.(최근이미지 출력 위젯)
     기본적인 사용법은 위에서 설명한 위젯 생성 방법과 동일하다. 단지 그 대상이 게시물이 아닌 이미지를 이젠 뽑아서 보여 주겠다는 것이다.
      
     설정에서 몇가지만 체크해 보자.

     - 스킨은 기본형으로 선택한다. (현재는 하나밖에 없음)
     - 글제목 길이 : 7   // 자신이꾸미고자 홈페이지에 따라 값이 달라진다.
    - 이미지 가로크기 : 105   // 105px 이미지 3개를 공지사항 아래쪽에 50%공간내에 표현 할것이다.
    - 이미지 수 : 3
    - 오른쪽 여백 : 15
    -  아래쪽 여백  : 15
    - 크기고정 체크
    - 가로그키 : 50%
    - 위치 : 왼쪽
    ---------------------------------------------------------------------------------------------
    이렇게 값을 지정하고(다른값들은 알아서 잘 선택하기 바람.) 코드 생성을 클릭한다.
    페이지관리에서 저장버튼을 누르고 화면상에서 이제 확인을 해보자.
    좀더 빠른 설명을 위해 미리 이미지3개를 등록해 두었다.
   
    공지사항 아래쪽에 3개의 이미지가 정상적으로 출력된것을 확인 할 수 있을 것이다.
    이미지 사이즈는 사용자가 마음대로 지정해 줄 수 있으나 현재 메뉴얼용으로 작업된 사이트의 경우
    이미지 사이즈 105px 정도로 3개를 출력시키니 딱 보기 좋게 나온다.

    ⑷ 최근댓글을 출력해 보자.(최근댓글위젯)
         공지사항이나 고객문의위젯 출력하는방법과 동일하다.
         순차적인 설명없이 그냥 설정값들만 언급해 본다.
    
     - 스킨 : 블로그스타일의 최신댓글 목록(blog_newest_comment) / 컬러셋 : 빨간색
     - 제목 : 최근댓글
     - 목록수 : 5개
     - 대상모듈 : 최근댓글로 보여주고 싶은 모듈 복수 선택 
     - 여백 : 왼쪽 15px ,  아래 15px
     - 크기고정 체크
     - 가로크기  50%
     - 위치 : 오른쪽

이상의 내용으로 페이지관리에서 공지사항, 고객문의, 갤러리, 최근댓글을 위젯으로 꾸며 보았다.
이젠 좌측 로그인 공간 아래쪽에 달력과 카운터 위젯을 추가해 보도록 하자.

4. 레이아웃편집으로 위젯추가하기 (달려위젯, 카운터 위젯 추가) - 좌측에 위젯을 추가하기 위해선 레이아웃 편집을 클릭해서 추가해야 한다.
     
    편집을 클릭하면 아래와 같은 화면을 확인 할 수 있다.
    
    
    *** 필수체크 !!!
    페이지관리에서 위젯추가와 레이아웃관리에서의 화면이 얼핏 비슷해 보이는것같은데 중요한것이 편집화면이 다른다는 것이다.
    
    페이지관리에서 편집화면은 위젯을 추가하면 추가된 위젯이 위 녹색으로 하나씩 편집화면에 생성이 되었다.
    하지만 레이아웃편집화면에 소스코드가 적혀 있는것을 볼 수 있을것이다.
    즉, 레이아웃 편집에서는 위젯을 추가하게 되면 코드생성이 된다.
   
   이렇게 생성된 코드를 복사하여 레이아웃 편집화면에서 직접 어느위치에 넣을지 소스를 분석하여 해당 코드를 추가해 주어야 한다.
   페이지관리와 레이아웃편집에서 위젯추가 방법이 이렇게 다르다는것을 이해하길 바라며, 달력위젯을 한번 추가해 보도록 하자.
   
    ⑴ 달력위젯추가 - 홈페이지 좌측의 로그인아래에 추가를 한다.
        위에서 설명한 레이아웃편집을 클릭한다음 레이아웃 편집화면에서 달력위젯을 클릭하면 아래와 같은 화면을 볼 수 있을 것이다.
    
    - 스킨 : 달력 및 글 현황 표시 (blog_calendar_list)
    - 대상모듈 : 달력위젯은 날짜별로 등록된 게시물 현황을 체크하는 위젯이다. 따라서 자신이 달력에 표시하고자 하는 모듈의 종류를 선택해 주면된다.
                      위  이미지를 참고해도 좋겠다.
     - 여백 : 좌측 부분 로그인 아래쪽에 추가 할것이기 때문에 로그인 부분과의 여백과 좌측,우측여백, 하단여백도 신경을 써야 한다.
                상단 : 10px
                좌측 : 5px
                우측 : 5px
                하단 : 10px
      - 크기고정 체크하지 않음
      - 위치 : 줄바꿈
      - 생성된 코드 :  코드 생성하기를 누르면 해당 조건에 맞는 위젯추가용 소스코드가 만들어진다.
      <img width="100%" height="100" src="http://zbxemanual.parandiary.com/zbxe/common/tpl/images/widget_bg.jpg"
      class="zbxe_widget_output" style="" widget="calendar" skin="blog_calendar_list" colorset="red" widget_cache="0" 
      mid_list="board,business,gallery,greeting,home,notice,qna,recruit" widget_margin_top="10" widget_margin_left="10" widget_margin_right="10" 
      widget_margin_bottom="10" widget_fix_width="" widget_width="50" widget_width_type="%" widget_position="" widget_sequence="198" />
       
      이런식으로 생성된 코드를 확인 할 수 있다.
      여기에서 mid_list="board,business,gallery,greeting,home,notice,qna,recruit" 라고 되어 있는데
      선택한 모듈이 어떤것인지 확인 할 수 있는 부분이 되겠다.
      
      이렇게 생성된 코드를 레이아웃 편집화면에서 어디쯤에 넣어야 될까? 
     

     위 그림에서 코드추가되는 부분을 아래에 별도로 첨부하였다. 추가되는 위치를 확인하고 자신의 레이아웃편집화면에서 추가해 보기 바란다.
     

     이렇게 추가하고 저장을 하면 홈페이지 화면상에 어떻게 보여지게 될까?
      
      좌측로그인 아래에 달력위젯이 추가된것을 확인 할 수 있다.
      레이아웃편집에서 위젯을 추가해서 사용하려면 어느정도 소스를 이해하는 능력이 필요하다.
      

5. 마지막으로 카운터위젯을 달력위젯 아래쪽에 추가해 보도록 하자.
   레이아웃 편집에서 기본카운터 위젯을 클릭하여 설정값을 지정해 준뒤 코드 생성을 하고 생성된 코드를 레이아웃 편집화면 달력위젯코드 아래쪽에 추가시켜준다.
   
   이렇게 생성된 코드를 복사해서   아래 그림과 같이 레이아웃 편지화면의 다력위젯 아래쪽에  추가하고 저장한다.
   

   메인화면에서는 달력위젯 아래쪽에 카운터가 추가된것을 확인 할 수 있다.
   

자..제대로 카운터가 나오는것을 확인 하였다.

레이아웃 편집화면에서 저장하기를 누르면 소스코드가 정렬이 안되는 현상이 발생하는데 이는 조만간 해결이 될것이라고 생각한다.      
           

이제 모든것이 끝났다.

• 다운받아 설치 및 퍼미션 변경하기
  관리자페이지 살펴보기 
  메뉴만들기 
  레이아웃 만들기 
  모듈만들기 
  메뉴에 모듈 연결 
  메인페이지 꾸미기 까지...

이러한 순차적인 기본 사이트 제작 방법을 숙지한다면 충분히 zbxe를 이용한 사이트 제작에 무리가 없을 것이라 판단된다.

이제 사용하면서 발생할 수 있는 문제점들과 요약정리를 마무리 메뉴얼로 작성해 보고자 한다.