Instantly share code, notes, and snippets.
-
Star
0
(0)
You must be signed in to star a gist -
Fork
0
(0)
You must be signed in to fork a gist
-
Save damulhan/91ae16d0e56621e85835392bfc9df95a to your computer and use it in GitHub Desktop.
CIBoard - 3 Level menu (Example)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* for multilevel dropdown menu -- CIBoard기본 테마에서 3단 메뉴를 위해 추가되는 부분 */ | |
| .dropdown-submenu { position: relative; } | |
| .dropdown-submenu > .dropdown-menu { top: 0; left: 100%; margin: 20px; margin-top: -6px; margin-left: -1px; background: #3ddde6; } | |
| .dropdown-submenu:hover > .dropdown-menu { display: block; } | |
| .dropdown-submenu > a:after { display: block; content: " "; float: right; width: 0; height: 0; border-color: transparent; border-style: solid; border-width: 5px 0 5px 5px; border-left-color: #ccc; margin-top: 5px; margin-right: -10px; } | |
| .dropdown-submenu:hover > a:after { border-left-color: #fff; } | |
| .dropdown-submenu.pull-left { float: none; } | |
| .dropdown-submenu.pull-left > .dropdown-menu { left: -100%; margin-left: 10px; -webkit-border-radius: 6px 0 6px 6px; -moz-border-radius: 6px 0 6px 6px; border-radius: 6px 0 6px 6px; } | |
| .dropdown-submenu > .dropdown-menu li { overflow: hidden; padding-left: 5px; width: 200px; } | |
| .dropdown-submenu > .dropdown-menu li a { overflow: hidden; } | |
| /* sidemenu */ | |
| #sidemenu2 .sidebar_menu { display: block; margin: 0; padding: 10px 15px 10px 15px; font-weight: bold; font-size: 15px; color: #0f5186; } | |
| #sidemenu2 .sidebar_menu .headline { margin: 20px 0 20px; } | |
| #sidemenu2 .sidebar_menu .headline h3 { display: inline-block; margin: 0 0 -2px; padding-bottom: 5px; font-size: 24px; border-bottom: none; } | |
| #sidemenu2 ul { list-style: none; margin: 0; padding: 0; } | |
| #sidemenu2 ul li { display: block; margin: 0; padding: 5px 0px 5px 0px; font-size: 14px; font-weight: normal; color: #0f5186; border-bottom: 1px solid #ddd; } | |
| #sidemenu2 ul li a { color: #0f5186; font-weight: normal; } | |
| #sidemenu2 ul li a.on { font-weight: bold; } | |
| #sidemenu2 ul li:last-child { border-bottom: none; } | |
| #sidemenu2 ul.level2 { padding: 5px 0 10px 10px; } | |
| #sidemenu2 ul.level2 li { border-bottom: none; font-size: 12px; margin: 0; padding: 0; } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?php | |
| function get_menu($menu_id, $menu) { | |
| foreach($menu as $ml) { | |
| foreach($ml as $mll) { | |
| if($mll['men_id'] == $menu_id) | |
| return $mll; | |
| } | |
| } | |
| return null; | |
| } | |
| function get_parentids($menu_id, $menu) { | |
| $ids = array(); | |
| $ml = get_menu($menu_id, $menu); | |
| while($ml['men_parent'] != 0) { | |
| array_push($ids, $ml['men_id']); | |
| $ml = get_menu($ml['men_parent'], $menu); | |
| } | |
| array_push($ids, $ml['men_id']); | |
| return $ids; | |
| } | |
| function get_top_parentid($menu_id, $menu) { | |
| return array_pop(get_parentids($menu_id, $menu)); | |
| } | |
| ?> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?php | |
| /* 레이아웃 사이드바 참고 | |
| ## http://www.ciboard.co.kr/skin/p/489 | |
| */ | |
| // 만약 $view['board_key'] 값이 존재하면 게시판의 읽기또는 쓰기페이지라는 거고 없다면 url로 판단 | |
| if(isset($view['board_key'])) { | |
| $chk_url = $view['board_key']; | |
| } else { | |
| // 마지막 url 값으로 판단 | |
| $url = explode('/', $this->uri->uri_string()) ; | |
| $chk_url = $url[count($url)-1] ; | |
| } | |
| if (element('menu', $layout)) { | |
| $menu = element('menu', $layout); | |
| // 메뉴 배열의 길이만큼 반복 | |
| foreach($menu as $ml_arr) { | |
| foreach($ml_arr as $mll) { | |
| #if(strstr($mll['men_link'], $chk_url)) { // 문자열 포함하고 있다면 으로 한다. 같은 카테고리에 세부 카테고리가 생길수 있으므로 | |
| $match = preg_match("/(".$chk_url.")$/", trim($mll['men_link']), $matches); | |
| if($match) { // 문자열 포함하고 있다면 으로 한다. 같은 카테고리에 세부 카테고리가 생길수 있으므로 | |
| // 메뉴 아이디 가지고 온다. 그메뉴만 추출하기 위함 | |
| #if($mll['men_parent']) { | |
| $currentmenu_id = $mll['men_id'] ; // 서브메뉴 없을때 | |
| $currentmenu_parentid = $mll['men_parent']; | |
| $currentmenu_top_parentid = get_top_parentid($currentmenu_id, $menu); | |
| #} | |
| } | |
| } | |
| } | |
| $parentids = get_parentids($currentmenu_id, $menu); | |
| #print_r($parentids); | |
| if (element(0, $menu)) { | |
| foreach (element(0, $menu) as $mkey => $mval) { | |
| if ($currentmenu_top_parentid == element('men_id', $mval)) { | |
| $mlink = element('men_link', $mval) ? element('men_link', $mval) : 'javascript:;'; | |
| $menuhtml = '<div class="sidebar_menu"><div class="headline"><h3>'; | |
| $menuhtml .= html_escape(element('men_name', $mval)) . '</h3></div>'; | |
| // Level 1 sub menu | |
| $menu1 = element(element('men_id', $mval), $menu); | |
| $menuhtml .= '<ul class="level1">'; | |
| foreach ($menu1 as $skey => $sval) { | |
| $slink = element('men_link', $sval) ? element('men_link', $sval) : 'javascript:;'; | |
| // 현재 페이지 찾는 부분 | |
| $aclass = ''; | |
| #if(preg_match("/".$chk_url."$/", trim($slink), $matches)) $aclass = 'class="on"'; | |
| if(in_array(element('men_id', $sval), $parentids)) $aclass = 'class="on"'; | |
| $menuhtml .= '<li><a '.$aclass.'href="' . $slink . '" ' . element('men_custom', $sval); | |
| if (element('men_target', $sval)) $menuhtml .= ' target="' . element('men_target', $sval) . '"'; | |
| $menuhtml .= ' title="' . html_escape(element('men_name', $sval)) . '">' . html_escape(element('men_name', $sval)) . '</a>'; | |
| // Level 2 sub menu | |
| $menu2 = element(element('men_id', $sval), $menu); | |
| if($menu2 && !empty($aclass)) { | |
| $menuhtml .= '<ul class="level2">'; | |
| foreach ($menu2 as $tkey => $tval) { | |
| $tlink = element('men_link', $tval) ? element('men_link', $tval) : 'javascript:;'; | |
| // 현재 페이지 찾는 부분 | |
| $aclass = ''; | |
| #if(preg_match("/".$chk_url."$/", trim($tlink), $matches)) $aclass = 'class="on"'; | |
| if(in_array(element('men_id', $tval), $parentids)) $aclass = 'class="on"'; | |
| $menuhtml .= '<li><a '.$aclass.'href="' . $tlink . '" ' . element('men_custom', $tval); | |
| if (element('men_target', $tval)) $menuhtml .= ' target="' . element('men_target', $tval) . '"'; | |
| $menuhtml .= ' title="' . html_escape(element('men_name', $tval)) . '">' . html_escape(element('men_name', $tval)) . '</a>'; | |
| $menuhtml .= "</li>\n"; | |
| } | |
| $menuhtml .= "</ul>\n"; | |
| } | |
| $menuhtml .= "</li>\n"; | |
| } | |
| $menuhtml .= "</ul></div>\n"; | |
| } else if($currentmenu_id == element('men_id', $mval)) { | |
| $menuhtml = '<div class="sidebar_menu"><div class="headline"><h3>'; | |
| $menuhtml .= html_escape(element('men_name', $mval)) . '</h3></div>'; | |
| $menuhtml .= '<ul>'; | |
| foreach (element($currentmenu_id, $menu) as $skey => $sval) { | |
| $slink = element('men_link', $sval) ? element('men_link', $sval) : 'javascript:;'; | |
| // 현재 페이지 찾는 부분 | |
| $aclass = ''; | |
| if(preg_match("/".$chk_url."$/", trim($slink), $matches)) { | |
| $aclass = 'class="on"'; | |
| } | |
| $menuhtml .= '<li><a '.$aclass.'href="' . $slink . '" ' . element('men_custom', $sval); | |
| if (element('men_target', $sval)) { | |
| $menuhtml .= ' target="' . element('men_target', $sval) . '"'; | |
| } | |
| $menuhtml .= ' title="' . html_escape(element('men_name', $sval)) . '">' . html_escape(element('men_name', $sval)) . '</a></li>'; | |
| } | |
| $menuhtml .= '</ul></div>'; | |
| } else if( $currentmenu_id == $mkey) { | |
| #$menuhtml .= '<ul>'; | |
| $mlink = element('men_link', $mval) ? element('men_link', $mval) : 'javascript:;'; | |
| $menuhtml .= '<li><a '.$aclass.' href="' . $mlink . '" ' . element('men_custom', $mval); | |
| if (element('men_target', $mval)) { | |
| $menuhtml .= ' target="' . element('men_target', $mval) . '"'; | |
| } | |
| $menuhtml .= ' title="' . html_escape(element('men_name', $mval)) . '">' . html_escape(element('men_name', $mval)) . '</a></li>'; | |
| #$menuhtml .= '</ul>'; | |
| } | |
| } | |
| } | |
| } | |
| ?> | |
| <?php if(isset($menuhtml)): ?> | |
| <div class="widget section_03"> | |
| <div id="sidemenu2"> | |
| <?php | |
| // 만약 현재 페이지에서 메뉴가 없다면 노출한다. | |
| echo $menuhtml; | |
| ?> | |
| </div> | |
| </div> | |
| <?php endif; ?> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* 관련 소스 | |
| CIBoard-Pagemenu2 | |
| https://github.com/damulhan/ciboard-pagemenu2 | |
| */ | |
| <div id="topmenu-navbar-collapse" class="navbar-collapse collapse "> | |
| <ul class="nav navbar-nav navbar-right navbar-hover"> | |
| <?php | |
| $menuhtml = ''; | |
| if (element('menu', $layout)) { | |
| $menu = element('menu', $layout); | |
| if (element(0, $menu)) { | |
| foreach (element(0, $menu) as $mkey => $mval) { | |
| if (element(element('men_id', $mval), $menu)) { | |
| $mlink = element('men_link', $mval) ? element('men_link', $mval) : 'javascript:;'; | |
| $menuhtml .= "\n\t".'<li class="dropdown"><a href="' . $mlink . '" ' . element('men_custom', $mval); | |
| if (element('men_target', $mval)) { $menuhtml .= ' target="' . element('men_target', $mval) . '"'; } | |
| $menuhtml .= ' title="' . html_escape(element('men_name', $mval)) . '">' . (html_escape(element('men_name', $mval))) . '</a>'; | |
| $menuhtml .= "\n\t".'<ul class="dropdown-menu">'; | |
| foreach (element(element('men_id', $mval), $menu) as $skey => $sval) { | |
| $slink = element('men_link', $sval) ? element('men_link', $sval) : 'javascript:;'; | |
| $ssmenu = element(element('men_id', $sval), $menu); | |
| if( empty($ssmenu) ) { # 하위메뉴가 없으면 | |
| $menuhtml .= "\n\t\t".'<li><a href="' . $slink . '" ' . element('men_custom', $sval); | |
| if (element('men_target', $sval)) { $menuhtml .= ' target="' . element('men_target', $sval) . '"'; } | |
| $menuhtml .= ' title="' . html_escape(element('men_name', $sval)) . '">' . html_escape(element('men_name', $sval)) . '</a></li>'; | |
| } else { # 하위메뉴가 있으면 | |
| $menuhtml .= "\n\t\t".'<li class="dropdown-submenu"><a href="' . $slink . '" ' . element('men_custom', $sval); | |
| if (element('men_target', $sval)) { $menuhtml .= ' target="' . element('men_target', $sval) . '"'; } | |
| $menuhtml .= ' title="' . html_escape(element('men_name', $sval)) . '">' . html_escape(element('men_name', $sval)) . '</a>'; | |
| $menuhtml .= "\n\t\t".'<ul class="dropdown-menu">'; | |
| foreach (element(element('men_id', $sval), $menu) as $sskey => $ssval) { | |
| $sslink = element('men_link', $ssval) ? element('men_link', $ssval) : 'javascript:;'; | |
| $menuhtml .= "\n\t\t\t".'<li><a href="' . $sslink . '" ' . element('men_custom', $ssval); | |
| if (element('men_target', $ssval)) { $menuhtml .= ' target="' . element('men_target', $ssval) . '"'; } | |
| $menuhtml .= ' title="' . html_escape(element('men_name', $ssval)) . '">' . html_escape(element('men_name', $ssval)) . '</a></li>'; | |
| } | |
| $menuhtml .= "\n\t\t".'</ul></li>'; | |
| } | |
| } | |
| $menuhtml .= "\n\t".'</ul></li>'; | |
| } else { | |
| $mlink = element('men_link', $mval) ? element('men_link', $mval) : 'javascript:;'; | |
| $menuhtml .= "\n\t".'<li><a href="' . $mlink . '" ' . element('men_custom', $mval); | |
| if (element('men_target', $mval)) { $menuhtml .= ' target="' . element('men_target', $mval) . '"'; } | |
| $menuhtml .= ' title="' . html_escape(element('men_name', $mval)) . '">' . html_escape(element('men_name', $mval)) . '</a></li>'; | |
| } | |
| } | |
| } | |
| } | |
| echo $menuhtml; | |
| ?> | |
| <li> | |
| <form class="navbar-form navbar-right" name="header_search" id="header_search" action="<?php echo site_url('search'); ?>" onSubmit="return headerSearch(this);"> | |
| <div class="form-group"> | |
| <input type="text" class="form-control px150" placeholder="검색" name="skeyword" accesskey="s" /> | |
| <button class="btn btn-primary btn-sm" type="submit"><i class="fa fa-search"></i></button> | |
| </div> | |
| </form> | |
| <script type="text/javascript"> | |
| //<![CDATA[ | |
| $(function() { | |
| $('#topmenu-navbar-collapse .dropdown').hover(function() { | |
| $(this).addClass('open'); | |
| }, function() { | |
| $(this).removeClass('open'); | |
| }); | |
| }); | |
| function headerSearch(f) { | |
| var skeyword = f.skeyword.value.replace(/(^\s*)|(\s*$)/g,''); | |
| if (skeyword.length < 2) { | |
| alert('2글자 이상으로 검색해 주세요'); | |
| f.skeyword.focus(); | |
| return false; | |
| } | |
| return true; | |
| } | |
| //]]> | |
| </script> | |
| </li> | |
| </ul> | |
| </div> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
관련글:
http://www.ciboard.co.kr/skin/p/1677