검색바와 메뉴 위치 수정 문의 드립니다.
본문
홈페이지를 만들어 보려고 열심히 그누보드로 공사중인데요.
검색바와 메뉴 위치를 좀 수정하고 싶은데 원하는 위치로 잘 가질 않네요. ㅠㅜ
현재 검색바는 메뉴와 같은 위치에서 오른쪽에 붙어있고, 메뉴는 왼쪽으로 붙어 있습니다.
이걸 검색바는 최상단 로그인자리 중앙으로, 메뉴도 중앙으로 정렬해 보고 싶습니다.
물론 검색바의 배경색은 로그인바의 배경색과 동일하게 맞출 생각입니다.
근데 소스상에서 위치를 바꿔보려니 자구 엉뚱한데 붙고 중앙정렬이 안되고... ㅠㅜ
head.php 파일의 소스는 아래와 같습니다.
<?php
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가
if (G5_IS_MOBILE) {
include_once(G5_THEME_MOBILE_PATH.'/head.php');
return;
}
include_once(G5_THEME_PATH.'/head.sub.php');
include_once(G5_LIB_PATH.'/latest.lib.php');
include_once(G5_LIB_PATH.'/outlogin.lib.php');
include_once(G5_LIB_PATH.'/poll.lib.php');
include_once(G5_LIB_PATH.'/visit.lib.php');
include_once(G5_LIB_PATH.'/connect.lib.php');
include_once(G5_LIB_PATH.'/popular.lib.php');
?>
<!-- 상단 시작 { -->
<div id="hd">
<h1 id="hd_h1"><?php echo $g5['title'] ?></h1>
<div id="skip_to_container"><a href="#container">본문 바로가기</a></div>
<?php
if(defined('_INDEX_')) { // index에서만 실행
include G5_BBS_PATH.'/newwin.inc.php'; // 팝업레이어
}
?>
<div id="tnb">
<ul>
<div>
<a href="https://www.facebook.com/web.planner.79" target="_blank"><i class="fa fa-facebook-square" aria-hidden="true"></i> Facebook</a></div>
<div style="border-right:1px solid #353535">
<a href="https://www.instagram.com/1004planner/" target="_blank"><i class="fa fa-instagram" aria-hidden="true"></i> Instagram</a></div>
<div style="border-right:1px solid #353535">
<a href="https://open.kakao.com/o/gCWwiW0" target="_blank"><i class="fa fa-comment" aria-hidden="true"></i> Opentalk</a></div>
<?php if ($is_member) { ?>
<li style="border-right:1px solid #353535"><a href="<?php echo G5_BBS_URL ?>/member_confirm.php?url=<?php echo G5_BBS_URL ?>/register_form.php"><i class="fa fa-cog" aria-hidden="true"></i> Modify</a></li>
<li><a href="<?php echo G5_BBS_URL ?>/logout.php"><i class="fa fa-sign-out" aria-hidden="true"></i> Log out</a></li>
<?php if ($is_admin) { ?>
<li class="tnb_admin"><a href="<?php echo G5_ADMIN_URL ?>"><b><i class="fa fa-user-circle" aria-hidden="true"></i> Master</b></a></li>
<?php } ?>
<?php } else { ?>
<li style="border-right:1px solid #353535"><a href="<?php echo G5_BBS_URL ?>/register.php"><i class="fa fa-user-plus" aria-hidden="true"></i> Sign up</a></li>
<li><a href="<?php echo G5_BBS_URL ?>/login.php"><b><i class="fa fa-sign-in" aria-hidden="true"></i> Login</b></a></li>
<?php } ?>
</ul>
</div>
<div id="hd_wrapper">
<div id="logo">
<a href="<?php echo G5_URL ?>"><img src="<?php echo G5_IMG_URL ?>/logo.png" alt="<?php echo $config['cf_title']; ?>"></a>
</div>
</div>
<style>
.nav {background: #151515;background:rgba(21,21,21,0.8);}
.fixed {position: fixed; top:0; margin:0 auto; width: 100%;z-index:90 }
</style>
<div class="nav">
<nav id="gnb">
<h2>메인메뉴</h2>
<div class="gnb_wrap">
<div class="hd_sch_wr">
<fieldset id="hd_sch" >
<legend>사이트 내 전체검색</legend>
<form name="fsearchbox" method="get" action="<?php echo G5_BBS_URL ?>/search.php" onsubmit="return fsearchbox_submit(this);">
<input type="hidden" name="sfl" value="wr_subject||wr_content">
<input type="hidden" name="sop" value="and">
<label for="sch_stx" class="sound_only">검색어 필수</label>
<input type="text" name="stx" id="sch_stx" maxlength="20" placeholder="Search..">
<button type="submit" id="sch_submit" value="검색"><i class="fa fa-search" aria-hidden="true"></i><span class="sound_only">검색</span></button>
</form>
<script>
function fsearchbox_submit(f)
{
if (f.stx.value.length < 2) {
alert("검색어는 두글자 이상 입력하십시오.");
f.stx.select();
f.stx.focus();
return false;
}
// 검색에 많은 부하가 걸리는 경우 이 주석을 제거하세요.
var cnt = 0;
for (var i=0; i<f.stx.value.length; i++) {
if (f.stx.value.charAt(i) == ' ')
cnt++;
}
if (cnt > 1) {
alert("빠른 검색을 위하여 검색어에 공백은 한개만 입력할 수 있습니다.");
f.stx.select();
f.stx.focus();
return false;
}
return true;
}
</script>
</fieldset>
</div>
<ul id="gnb_1dul">
<li class="gnb_1dli gnb_mnal"><button type="button" class="gnb_menu_btn"><i class="fa fa-bars" aria-hidden="true"></i><span class="sound_only">전체메뉴열기</span></button></li>
<?php
$sql = " select *
from {$g5['menu_table']}
where me_use = '1'
and length(me_code) = '2'
order by me_order, me_id ";
$result = sql_query($sql, false);
$gnb_zindex = 999; // gnb_1dli z-index 값 설정용
$menu_datas = array();
for ($i=0; $row=sql_fetch_array($result); $i++) {
$menu_datas[$i] = $row;
$sql2 = " select *
from {$g5['menu_table']}
where me_use = '1'
and length(me_code) = '4'
and substring(me_code, 1, 2) = '{$row['me_code']}'
order by me_order, me_id ";
$result2 = sql_query($sql2);
for ($k=0; $row2=sql_fetch_array($result2); $k++) {
$menu_datas[$i]['sub'][$k] = $row2;
}
}
$i = 0;
foreach( $menu_datas as $row ){
if( empty($row) ) continue;
?>
<li class="gnb_1dli" style="z-index:<?php echo $gnb_zindex--; ?>">
<a href="<?php echo $row['me_link']; ?>" target="_<?php echo $row['me_target']; ?>" class="gnb_1da"><?php echo $row['me_name'] ?></a>
<?php
$k = 0;
foreach( (array) $row['sub'] as $row2 ){
if( empty($row2) ) continue;
if($k == 0)
echo '<span class="bg">하위분류</span><ul class="gnb_2dul">'.PHP_EOL;
?>
<li class="gnb_2dli"><a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>" class="gnb_2da"><?php echo $row2['me_name'] ?></a></li>
<?php
$k++;
} //end foreach $row2
if($k > 0)
echo '</ul>'.PHP_EOL;
?>
</li>
<?php
$i++;
} //end foreach $row
if ($i == 0) { ?>
<li class="gnb_empty">메뉴 준비 중입니다.<?php if ($is_admin) { ?> <a href="<?php echo G5_ADMIN_URL; ?>/menu_list.php">관리자모드 > 환경설정 > 메뉴설정</a>에서 설정하실 수 있습니다.<?php } ?></li>
<?php } ?>
</ul>
<div id="gnb_all">
<h2>전체메뉴</h2>
<ul class="gnb_al_ul">
<?php
$i = 0;
foreach( $menu_datas as $row ){
?>
<li class="gnb_al_li">
<a href="<?php echo $row['me_link']; ?>" target="_<?php echo $row['me_target']; ?>" class="gnb_al_a"><?php echo $row['me_name'] ?></a>
<?php
$k = 0;
foreach( (array) $row['sub'] as $row2 ){
if($k == 0)
echo '<ul>'.PHP_EOL;
?>
<li><a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>"><i class="fa fa-caret-right" aria-hidden="true"></i> <?php echo $row2['me_name'] ?></a></li>
<?php
$k++;
} //end foreach $row2
if($k > 0)
echo '</ul>'.PHP_EOL;
?>
</li>
<?php
$i++;
} //end foreach $row
if ($i == 0) { ?>
<li class="gnb_empty">메뉴 준비 중입니다.<?php if ($is_admin) { ?> <br><a href="<?php echo G5_ADMIN_URL; ?>/menu_list.php">관리자모드 > 환경설정 > 메뉴설정</a>에서 설정하실 수 있습니다.<?php } ?></li>
<?php } ?>
</ul>
<button type="button" class="gnb_close_btn"><i class="fa fa-times" aria-hidden="true"></i></button>
</div>
</div>
</nav>
</div>
<script>
$(function(){
$(".gnb_menu_btn").click(function(){
$("#gnb_all").show();
});
$(".gnb_close_btn").click(function(){
$("#gnb_all").hide();
});
});
</script>
<script>
$(window).scroll(function(){
var sticky = $('.nav'),
scroll = $(window).scrollTop();
if (scroll >= 280) sticky.addClass('fixed');
else sticky.removeClass('fixed');
});
</script>
</div>
<!-- } 상단 끝 -->긴 글이지만 확인해주시고 어디 부분을 수정하면 될지 알려주시면 진심 감사합니다.
답변 1
<div id="tnb"><ul>에서 Opentalk 와 Master 사이에 <div>사이트 검색 메뉴바 코드</div>를 넣어주세요.
53~179째줄 사이의 소스를 31과 32번째줄 사이에 넣어주라는 말씀이신거죠?
ㅠㅜ 위처럼 수정하니 메뉴바도 로그인 자리로 가서 붙었습니다 ㅠㅜ
답변을 작성하시기 전에 로그인 해주세요.
