기존 메뉴 소스 참고하여 편집하시면 됩니다. 

상단 네비게이션 

==========>

<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>

<==========

사이드바 

==========> 

/* 레이아웃 사이드바 참고 

## 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; ?>

<========== 

CSS 

============>

/* for multilevel dropdown menu */

.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; } 

#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; }