2차(서브)메뉴를 중간(?)부분에 출력해보기~ 정보
2차(서브)메뉴를 중간(?)부분에 출력해보기~본문
안녕하세요~ 오늘은 중간 네비게이션 메뉴를 적용하는 팁을 공유 해볼까 합니다.
한번쯤은 위의 이미지와 같은 중간에 나오는 2차(서브)메뉴들을 보신적 있으시죠?
예전에 이 부분을 적용해 보고 싶어서 질문글을 올리기도 했었는데요~
자동메뉴로 상단에 출력되는 메뉴들 중에서 2차 메뉴만 따로 분리해서 중간에 적용해 보려고 하다가 포기 했었는데요 이번에 스킨을 제작 하면서 여러가지 시도를 해보고 적용이 잘 되어 공유해 봅니다.
저처럼 초보자 분들에게 도움이 되길 바랍니다.
소스코드는 아래와 같습니다.
게시판이 아닌 일반 페이지일경우 (ex : about.php)
<?php
$menu_datas = get_menu_db(0, true);
$current_url = $_SERVER['REQUEST_URI'];
$is_submenu_active = false;
foreach ($menu_datas as $row) {
if (empty($row)) continue;
if ($row['me_link'] === $current_url) {
$is_submenu_active = true;
?>
<?php
foreach ((array)$row['sub'] as $row2) {
if (empty($row2)) continue;
?>
<li class="l_menu_<?php echo ($row2['me_link'] === $current_url) ? 'ON' : 'OFF'; ?>">
<a href="<?php echo $row2['me_link']; ?>"><?php echo $row2['me_name']; ?></a>
</li>
<?php
}
break;
}
}
if (!$is_submenu_active) {
foreach ($menu_datas as $row) {
if (empty($row)) continue;
$is_submenu_active = false;
foreach ((array)$row['sub'] as $row2) {
if (empty($row2)) continue;
if ($row2['me_link'] === $current_url) {
$is_submenu_active = true;
break;
}
}
if ($is_submenu_active) {
?>
<li class="l_menu_ON">
<a href="<?php echo $row['me_link']; ?>"><?php echo $row['me_name']; ?></a>
</li>
<?php
foreach ((array)$row['sub'] as $row2) {
if (empty($row2)) continue;
?>
<li class="l_menu_<?php echo ($row2['me_link'] === $current_url) ? 'ON' : 'OFF'; ?>">
<a href="<?php echo $row2['me_link']; ?>"><?php echo $row2['me_name']; ?></a>
</li>
<?php
}
break;
}
}
}
?>
현재 페이지 의 url을 기준으로 1차메뉴 와 1차메뉴에 속한 2차메뉴를 찾아서 2차메뉴만 출력해주는 방식입니다. 또한 클릭한 2차 메뉴만 활성화 시켜줍니다.
게시판일 경우 (ex : 게시판명 -> notice )
<?php
$menus = array(
'notice' => array(
'title' => '공지사항',
'bo_table' => 'notice',
),
'faq' => array(
'title' => '자주묻는 질문',
'bo_table' => 'faq',
),
'qna' => array(
'title' => '질문/답변',
'bo_table' => 'qna',
),
);
$current_menu = isset($_GET['bo_table']) ? $_GET['bo_table'] : '';
?>
<ul id="wm_snb">
<?php foreach ($menus as $menu_key => $menu) { ?>
<li class="<?php echo ($current_menu == $menu['bo_table']) ? 'menu_ON' : 'menu_OFF' ?>">
<a href="/bbs/board.php?bo_table=<?php echo $menu['bo_table'] ?>"><?php echo $menu['title'] ?></a>
</li>
<?php } ?>
</ul>
게시판에서는 $board 변수를 사용하지 않고 $menus 변수를 사용했습니다. 이유는 $board 변수충돌을 막기 위함이죠~ (다들 아시는 부분이죠--;;) 처음에 이거 때문에 좀 헤매였습니다.
위의 소스를 원하시는 위치에 붙여 넣으셔도 되지만 나중에 관리하기 힘드시기 때문에 sub_menu.nav.php 이런식으로 파일을 생성 하신후 원하시는 위치에서 인클루드 하시면 편하실 겁니다.
오늘도 즐거운 하루 되세요
!-->!-->
추천
3
3
댓글 11개
좋은 팁, 감사합니다. ^^
@일상여행2 초보자의 팁입니다
댓글 감사합니다
댓글 감사합니다
감사합니다.
@민트다이어리 댓글 감사합니다
와 천재...영재님 .. 대박
@myfree 과찬이십니다. 초보라서~ 많이 배우고 있는 상황입니다.^^
테이블명이나 메뉴명을 바꾸면 기능이 안되는데요.
@산비탈 실제 사용하는 테이블명 및 메뉴명으로 수정해 주셔야 합니다.^^
답변 감사합니다.
id="wm_snb"는 어디를 참조하나요.
id="wm_snb"는 어디를 참조하나요.
@산비탈 id="wm_snb" 이부분은 CSS 부분이므로 원하시는 형태로 css를 만드시면 됩니다.
선생님 제작하시다가 어디 가셨나요 ? 답변 바랍니다.