묻고답하기

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

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 남기남
진카 ^^ 이런것도 가능한가요? [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 出会い 
상오기 컴포넌트에서 업로드한 파일 리스트 사용하려면?  
제트보드 최근 이미지에서 이미지 클릭시 레이어로 보이게 하려면???  
나도마타 필드내용 불러오는것관요 필드에 입력하는 방법 문의드립니다.  
금산 인삼밭 SSH 사용 설정후 홈피 화면이 이상하게 나옵니다. [1] file 2009.03.02 by 出会い
소리없이 업데이트 에러. 다시 설치시 예전 파일 복구 가능? 부탁드립니다! [3] 2009.03.02 by だ栄
아그리고 이 상황을 어찌해야 하는지??? ㅜㅜ [2] file 2009.03.02 by 出会い
꽃돼지 블로그에서 프로필 이미지 사이즈 조절 문의~?? [5] file 2009.03.02 by 出会い
웰즈 홈페이지에 회원간 간단한 게임기능. [4] 2009.03.02 by 웰즈
이상해 (긴급) 로고 클릭시 홈으로 이동이상 [1] 2009.03.02 by 出青