묻고답하기

해커다님 레이아웃 수정 문의

2009.02.27 15:57

생초짜

홈 페이지 만들어 보려고 배우는 중인데요
해커더님의 "자주와" 레이아웃이 직관성이 좋은 것 같아 적용해 보려고 하는데

 아래 그림에서 1, 2, 3, 란에 원하는 위젯이나 배너매뉴를 넣으려면
레이아웃 어느 곳에 삽입(수정)해야 하는지 알려 주실 수 있는지 부탁 드려 봅니다
바쁘시겠지만, 초보자 눈 높이로 알려 주신다면 넘넘 감사하겠습니다.
상세 설명이 어려우면 힌트라도 주셨으면 감사하겠습니다.

해커다님 홈페이지에 같은 질문 글 올렸는데 바쁘신지 아직 답변을 못 얻어 동일한 질문을 다시 한 번
올려 봅니다.

zazuwa.gif

해당 레이아웃
<!--// js 파일 import -->
<!--%import("js/xe_official.js")-->

<!--// 레이아웃과 연동될 css 파일 import -->
<
!--@if($layout_info->colorset == "white")-->
    <!--%import("css/white.css")-->
<
!--@elseif($layout_info->colorset == "black")-->
    <!--%import("css/black.css")-->
<
!--@else-->
    <!--%import("css/default.css")-->
<
!--@end-->
<
!--@if($layout_info->background_image)-->
<style type="text/css">
    body {  background:#FFFFFF url({getUrl()}{$layout_info->background_image}) repeat-x left top; }
</style>
<
!--@end-->

<!--@if(!$layout_info->colorset)-->
   
{@$layout_info->colorset = "default"}
<
!--@end-->

<div id="bodyWrap">
    <div id="header">
        <h1><a href="{$layout_info->index_url}"><
!--@if(!$layout_info->logo_image)--><img src="./images/{$layout_info->colorset}/zeroBoardXE.png" alt="ZeroBoard™  XE" class="iePngFix" /><!--@else--><img src="{$layout_info->logo_image}" alt="logo" border="0" class="iePngFix" /><!--@end--></a></h1>
<!-- 언어 선택 자리 -->
        <div id="language">
<a href=# onClick="this.style.behavior='url(#default#homepage)';this.setHomePage('http://www.zazuwa.com');"><img border="0" src="./images/default/tlwkr.gif" /></a>

        </div>
<!-- 언어 선택 자리 끝 -->
<!-- 최상단 메뉴 시작페이지로 -->
  <div id="uplink">
        <
!--@foreach($upmenu->list as $key => $val)-->
  <li><a href="{$val['href']}" <
!--@if($val['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@end-->>{$val['link']}</a></li>
        <
!--@end-->
  </div>
  <!-- 최상단 메뉴 끝 -->
  
<!-- 상단 메뉴 -->
  <div id="top_link">
        <
!--@foreach($top_menu->list as $key => $val)-->
  <li><a href="{$val['href']}" <
!--@if($val['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@end-->>{$val['link']}</a></li>
        <
!--@end-->
  </div>
<!-- 상단 메뉴 끝 -->

<!-- 메뉴바 좌측 이미지 -->
  <div id="manu_a">
  <a href="{$layout_info->manu_url_a}" target="_blank" ><
!--@if(!$layout_info->manu_a_image)--><img src="./images/{$layout_info->colorset}/zeroBoardXE.png" alt="ZeroBoard™  XE" class="iePngFix" /><!--@else--><img src="{$layout_info->manu_a_image}" alt="logo" border="0" class="iePngFix" /><!--@end--></a>
  </div>
<!-- 메뉴바 좌측 이미지 끝 -->

<!-- 메뉴바 우측 이미지 -->
  <div id="manu_b">
  <a href="{$layout_info->manu_url_b}" target="_blank" ><
!--@if(!$layout_info->manu_b_image)--><img src="./images/{$layout_info->colorset}/zeroBoardXE.png" alt="ZeroBoard™  XE" class="iePngFix" /><!--@else--><img src="{$layout_info->manu_b_image}" alt="logo" border="0" class="iePngFix" /><!--@end--></a>
  </div>
<!-- 메뉴바 우측 이미지 끝 -->

        <!-- GNB -->
        <ul id="gnb">
            <!-- main_menu 1차 시작 -->
            <
!--@foreach($main_menu->list as $key => $val)--><!--@if($val['link'])-->
                <
!--@if($val['selected'])-->
                    {@ $menu_1st = $val }
                <
!--@end-->

                <li <!--@if($val['selected'])-->class="on"<!--@end-->><a href="{$val['+ 'href']}" <!--@if($val['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@end-->>{$val['link']}</a></li>

            <!--@endif--><!--@endforeach-->
        </ul>


<!-- 검색기능 -->
            <form action="{getUrl()}" method="post" id="isSearch">
            <input type="hidden" name="mid" value="{$mid}" />
            <input type="hidden" name="act" value="IS" />

   <input name="search_target" type="radio" value="title" id="search_target" class="searchOrder" checked="checked" title="search option" />
   <label for="search_target" class="checked" id="search_target_label" onclick="showHide('selectOrder'); return false">통합검색</label>
   <ul id="selectOrder">
    <li>
     <input type="radio" name="search_target" value="title" id="search_target1" />
     <label for="search_target1" onclick="chkIsKind(1, '{$lang->title}'); return false;" onmouseover="this.className='on'" onmouseout="this.style.background='+ 'none'">{$lang->title}</label>
    </li>
    <li>
     <input type="radio" name="search_target" value="content" id="search_target2" />
     <label for="search_target2" onclick="chkIsKind(2, '{$lang->content}'); return false;" onmouseover="this.className='on'" onmouseout="this.style.background='none'">{$lang->content}</label>
    </li>
    <li>
     <input type="radio" name="search_target" value="title_content" id="search_target3" />
     <label for="search_target3" onclick="chkIsKind(3, '{$lang->title}+{$lang->content}'); return false;" onmouseover="this.className='on'" onmouseout="this.style.background='none'">{$lang->title}+{$lang->content}</label>
    </li>
    <li>
     <input type="radio" name="search_target" value="comment" id="search_target4" />
     <label for="search_target4" onclick="chkIsKind(4, '{$lang->comment}'); return false;" onmouseover="this.className='on'" onmouseout="this.style.background='none'">{$lang->comment}</label>
    </li>
    <li>
     <input type="radio" name="search_target" value="tag" id="search_target5" />
     <label for="search_target5" onclick="chkIsKind(5, '+ '{$lang->tag}'); return false;" onmouseover="this.className='on'" onmouseout="this.style.background='none'">{$lang->tag}</label>
    </li>
   </ul>
<input name="is_keyword" type="text" class="inputText" id="username_bg"  title="keyword" />

   <input type="image" src="./images/{$layout_info->colorset}/buttonSearch.gif" alt="{$lang->cmd_search}" class="submit" />
  </form>

    </div>
    <div id="contentBody">
        <div id="columnRight">
            <!-- 컨텐츠 시작 -->
            {$content}

        </div>
    </div>
    <ul id="footer">
    <!-- 원래 제로보드 아래 부분 로고가 있던곳 -->
        <!-- 않보이게 <li class="first-child">
            <address>
            <a href="
http://www.zeroboard.com" onclick="window.open(this.href);return false;"><img src="./images/{$layout_info->colorset}/powerdByZeroboard.gif" alt="Powered By ZeroBoard" width="106" height="5" /></a>
            </address>

        </li> 않보이게 끝 -->
<!-- 원래 제로보드 아래 부분 로고가 있던곳 끝 -->

        <!--@foreach($bottom_menu->list as $key => $val)-->
        <li><a href="{$val['href']}" <
!--@if($val['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@end-->>{$val['link']}</a></li>
        <
!--@endforeach-->
    </ul>
    </div>
<!-- 아래부분 내용 시작 -->
<div id="Copyright">Copyright <a href="
http://www.zazuwa.com" >zazuwa.com</a> ALL Rights Reserved. Designed by *** zazuwa
</div>

============================================================================================
해당 CSS
@charset "utf-8";
/*
NHN UIT Lab. WebStandardization Team (http://html.nhndesign.com/)
Jeong, Chan Myeong 070601~070630
*/

/* Default Skin - Start */
#selectLang { margin:0; padding:0; }
#gnb { margin:0; padding:0; }
#lnb { margin:0; padding:0; }
#lnb ul { margin:0; padding:0; }

/* 배경 */
body { background:#FFFFFF url(../images/default/bgBody.gif) repeat-x left top; }

/* 전체 넓이 설정 믿 헤더 높이 설정 */
#bodyWrap { width:790px; margin:60px auto 0 auto; }

/* 헤더 자리(헤더랑내용부분 사이에 10px공간을 없앴음 margin-bottom:0px; */
#header { position:relative; width:790px; height:120px; background:url(../images/default/bgHeader.gif) no-repeat right top; margin-bottom:0px; z-index:99;}

/* logo자리 */
#header h1 { margin:0; padding:0; position:absolute; top:-43px; left:300px;}

/* 언어 선택자리  다른 용도로 사용할려고 비워둠 */
#language { position:absolute; top:-50px; right:0px; z-index:100;}

#it_search_form { position:absolute; top:50px; right:15px;}
#it_search_form .input { border:1px solid #bc4032; height:17px; width:120px; color:#888888; font-size:.9em;}
#it_search_form .submit_button { width:1px; height:1px; visibility:hidden; }

 

/* 1차메뉴 부분 모든 설정 */
#gnb { position:absolute; top:15px; left:250px; height:38px; overflow:hidden; white-space:nowrap; margin-bottom:10px;}
#gnb li { float:left; list-style:none; background:url(../images/default/bgGnbVr.gif) no-repeat left center; padding-left:2px; position:relative; left:-2px; white-space:nowrap;}
/* 메인 메뉴부분 그림자효과사용, 해당소스 filter: DropShadow(Color=green, OffX=1, OffY=1, Positive=1); clip: rect( );  */
#gnb li a { filter: DropShadow(Color=#527900, OffX=1, OffY=1, Positive=1); clip: rect( );  display:block; float:left; padding:10px 8px 0 8px; height:25px; color:#ffffff; white-space:nowrap; font-weight:bold; text-decoration:none; }
#gnb li a:hover,
#gnb li a:focus { color:#FFF79D; text-decoration:underline; }
#gnb li.on a { font-weight:bold; color:#ffffff;}

/* 최상단 메뉴 */
#uplink { margin:0; padding:0; position:relative; width:200px; height:10px; top:-25px; Left:20px; clear:both; }
#uplink a { text-decoration:none;  vertical-align:middle; color:#000000; font:12px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif;}
#uplink a:hover, {text-decoration:underline; color:#000000}
#uplink li { display:inline; padding:0 0em 0 0em; }
#uplink li a { text-decoration:none; color:#555555; font:12px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif;}
#uplink li a:hover, {text-decoration:underline; color:#214972}
#uplink li address { display:inline; }

/* 상단 메뉴 */
#top_link { margin:0; padding:0; position:absolute; width:200px; height:10px; top:-25px; right:-20px; clear:both; }
#top_link a { text-decoration:none;  vertical-align:middle; color:#000000; font:12px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif;}
#top_link a:hover, {text-decoration:underline; color:#000000}
#top_link li { display:inline; padding:0 0em 0 0em; }
#top_link li a { text-decoration:none; color:#555555; font:12px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif;}
#top_link li a:hover, {text-decoration:underline; color:#214972}
#top_link li address { display:inline; }

/* 메뉴바 좌측 이미지 */
#manu_a { margin:0; padding:0; position:absolute; top:0px; left:20px;}
#manu_b { margin:0; padding:0; position:absolute; top:0px; right:20px;}

/* 검색부분 모든 설정 */
#isSearch { position:absolute; top:80px; right:210px; width:310px; text-align:right;}
#isSearch .searchOrder { display:none;}
/* 검색 분류선택 설정 */
#isSearch .checked { position:absolute; left:-70px; top:2px; text-align:left; display:block; padding:4px 0 0 8px; width:80px; height:14px; background:url(../images/default/bgSearchTerm.gif) no-repeat; font:12px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; color:#666666; line-height:normal;}
*:first-child+html #isSearch .checked { top:1px; }
#isSearch ul { display:none; position:absolute; left:-110px; top:18px; padding:2px 0 3px 0; text-align:left; border:1px solid #A0C521; background:#ffffff;}
#isSearch ul li { width:67px; height:18px; list-style:none; }
#isSearch ul li input { display:none;}
#isSearch ul li label { display:block; padding:4px 0 0 4px; width:65px; height:15px; font:11px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; color:#333333;}
#isSearch ul li label.on { background:#A0C521; }
#isSearch ul li label:hover,
#isSearch ul li label:focus { background:#A0C521; }
#isSearch .inputText { vertical-align:middle; position:relative; top:; _top:1px; left:1px;  width:250px; height:14px; font:12px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-weight:bold; color:#333333; border:0px solid #ffffff;  }
#isSearch .inputText:hover,
#isSearch .inputText:focus
*:first-child+html body#default #isSearch .inputText { position:relative; top:0px;}
#isSearch .submit { vertical-align:middle; _position:relative; _top:-1px;}
*:first-child+html body#default #isSearch .submit { position:relative; top:0px;}

 

 


/*  하단 분계선 css */
#contentBody { position:relative; width:790px; padding-bottom:30px; overflow:hidden; border-bottom:1px solid #dddddd;}


/* 내용부분 */
#columnRight { width:790px; float:right; overflow:hidden;}
#content { width:100%; overflow:hidden;}

/* 하단 내용부분 */
#footer { margin:0; padding:0; border-top:3px solid #f4f4f4; text-align:center; padding:2em 0 1em; clear:both;}
#footer li { display:inline; padding:0 .0em 0 1em; background:url(../images/default/vrType1.gif) no-repeat left center;}
#footer li.first-child { background:none;}
#footer li a { color:#999999; font:.9em "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif;}
#footer li address { display:inline; }

/* 카피라이트 부분 */
#Copyright  {  margin:0; padding:0; border-top:0px solid #f4f4f4; text-align:center; padding:0em 0 0em; clear:both; color:#999999; font:.9em "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif;}


/* 메인 로그인 하단 지역선택 부분 css */
.STYLE3 { font-size: 12px;  color: #555555;}
.STYLE3 a { text-decoration: none; color: #555555;}
.STYLE3 a:hover { text-decoration:underline; }

글쓴이 제목 최종 글
XE 공지 글 쓰기,삭제 운영방식 변경 공지 [16] 2019.03.05 by 남기남
RainSky 탭방식 최근게시글에서 본문에 이미지가 없어도 기본 이미지 보이도록... [10] file 2009.03.03 by RainSky
달이뜬다 회원정보보기  
ora 업데이트 [1] 2009.03.03 by 지연아빠
김준근859 최근게시물 강의를 듣고 하는도중 월별보관현황출력에 암것도 없습니다.. file  
\"vusdo\" Faceoff 버전 질문이요.. [1] 2009.03.03 by 지연아빠
띵띵콩 템풀릿 설치경로 알려주세요.... [1] 2009.03.03 by 닝기리쓰레빠
진카 ^^ 이런것도 가능한가요? [1] 2009.03.03 by 지연아빠
새동산교회 기본 페이지와 메뉴오류... [1] file 2009.03.03 by 닝기리쓰레빠
현진 버그인가요?, 스타일편집기, html [1] 2009.03.03 by 닝기리쓰레빠
최소영329 회원정보리스트 삭제 부분이 페이지에 없습니다?(알려주신 곳의 내용이 제 페이지에 없어요) [2] 2009.03.03 by 켄트이즈
질문 아이디/비밀번호 찾기 에러 (dispMemberFindAccount) [1] 2009.03.02 by jjh2511
생초짜 해커다님 레이아웃 수정 문의 [1] 2009.03.02 by 세바스챤_™
박귀붕 ㄱ폰트가 크게 나와요 [1] file 2009.03.02 by ㅁㅁ
최은광 페이지에 배너 달려면 어떻게 해야 해요? [5] 2009.03.02 by 새우꽝
aflatoxin 플래시 적용시 페이지 수정이 안됩니다. [1] file 2009.03.02 by e~세상쉼터
석이- 페이지수정에서 내용변경 후 추가버튼을 누르면 "페이지를 찿을수 없습니다" [6] 2009.03.02 by 석이-
양지원967 백성찬님 질문한가지 만 해봅니다...!!..[수정1] [2] file 2009.03.02 by nobong
철이베베 웹진형태 최근문서 출력.. [1] 2009.03.02 by ㅇㅅㅇ
shoz 닉네임 대신 실명으로 글쓴이를 보이게 하려면 어떻게 해야 하나요? [1] 2009.03.02 by 띵야
베틀 케테고리형 메뉴 출력 어떻게 하나요? [8] file 2009.03.02 by 한이73
이창민 글쓴이를 변경하고 싶습니다.  
연어훈제 어제 질문했습니다만. xe와 .com연결에 대해서.. [14] 2009.03.02 by 연어훈제
pdos 질문) xe 공식 사이트 레이아웃 수정건 [2] 2009.03.02 by 出会い
smartcode 회원 그룹이 적용이 안되네요.. ㅜ [1] 2009.03.02 by 하와이에서
우라이 IP 차단이 돼질 않네요  
강호성872 글을 읽고나면 제목이 희미한 색깔로 바뀌는데 어디를 수정해야 하는지요?  
별을쏘다-★ 1.1.4-->1.1.5 업데이트 했는데 오류발생 [1] file 2009.03.02 by 出会い 
상오기 컴포넌트에서 업로드한 파일 리스트 사용하려면?  
제트보드 최근 이미지에서 이미지 클릭시 레이어로 보이게 하려면???  
나도마타 필드내용 불러오는것관요 필드에 입력하는 방법 문의드립니다.