그누보드에 부트스트랩 적용 - (4)
상단 메뉴말고, 진짜 메뉴를 가지고 놀려고 관리자 페이지, 메뉴 설정에서 메뉴를 만들려고 보니, 페이지가 제대로 뜨지 않는다.
jquery 버전 문제인듯 싶어 최신버전으로 변경했던 jquery 버전을 다시 1.8.3 으로 돌려야했다.
head.sub.php에서...
<script src="<?php echo G5_JS_URL ?>/jquery-1.8.3.min.js"></script>
되돌려놓고 게시판을 몇개 만들고 메뉴도 만들었다.
그룹01
-게시판01
-게시판02
그룹02
-게시판03
요렇게 만들어놓고 테스트!
원래 소스에서 메뉴를 표시해주는 부분은 head.php 에 아래 부분이다.
<nav id="gnb">
<h2>메인메뉴</h2>
<ul id="gnb_1dul">
<?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 값 설정용
for ($i=0; $row=sql_fetch_array($result); $i++) {
?>
<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
$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++) {
if($k == 0)
echo '<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
}
if($k > 0)
echo '</ul>'.PHP_EOL;
?>
</li>
<?php
}
if ($i == 0) { ?>
<li id="gnb_empty">메뉴 준비 중입니다.<?php if ($is_admin) { ?> <br><a href="<?php echo G5_ADMIN_URL; ?>/menu_list.php">관리자모드 > 환경설정 > 메뉴설정</a>에서 설정하실 수 있습니다.<?php } ?></li>
<?php } ?>
</ul>
</nav>
gnb...
그누보드는 메뉴설정을 참고로 자동으로 드롭다운 메뉴를 만들어준다.
부트스트랩에 있는 nav 내에 드롭다운을 만드는 기능을 참고로 적용해주면 될거 같다.
아래는 부트스트랩 예제 코드다.
<ul class="nav navbar-nav">
<li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>
<li><a href="#">Link</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li><a href="#">Separated link</a></li>
<li class="divider"></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>ul 안에 li 를 class=dropdown 으로 해주고 그 아래에 주루루~ 넣어주는 형태다.
참고해서 수정한 소스는..
<nav class="navbar navbar-default">
<div class="container">
<ul class="nav navbar-nav">
<?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 값 설정용
for ($i=0; $row=sql_fetch_array($result); $i++) {
$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);
$result2_cnt = mysql_num_rows($result2);
if ($result2_cnt == 0) { ?>
<li><a href="<?php echo $row['me_link']; ?>" target="_<?php echo $row['me_target']; ?>" ><?php echo $row['me_name'] ?></a></li>
<?php
} else { ?>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><?php echo $row['me_name'] ?></a>
<ul class="dropdown-menu" role="menu">
<?php
for ($k=0; $row2=sql_fetch_array($result2); $k++) { ?>
<li><a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>" ><?php echo $row2['me_name'] ?></a></li>
<?php
}
echo '</ul>'.PHP_EOL;
} ?>
</li>
<?php
}
if ($i == 0) { ?>
<li id="gnb_empty">메뉴 준비 중입니다.<?php if ($is_admin) { ?> <br><a href="<?php echo G5_ADMIN_URL; ?>/menu_list.php">관리자모드 > 환경설정 > 메뉴설정</a>에서 설정하실 수 있습니다.<?php } ?></li>
<?php } ?>
</ul>
</div><!-- /.container -->
</nav><!-- /.navbar -->
흠..
jquery를 다시 2.1.3으로 변경해줘야 잘 동작을 한다.
게시판01 클릭하면 아래처럼 나오는데...그때부터 드롭다운이 동작하지 않는다.. 흑...
왜 바보가 되지???? 더 살펴봐야겠네..