hi all.
i have a problem that i could not understand.
i am trying to create a nav bar using bootstrap and manage the navbar using couch.
It means that i can update the position and the navbar link using COUCH cms.
i am using the nested_pages tag
here is my code in index.php
the problem is the dropdown does not work.
help please?
here is the code without couch integration.
without couch, it works perfectly.
please help..
i have a problem that i could not understand.
i am trying to create a nav bar using bootstrap and manage the navbar using couch.
It means that i can update the position and the navbar link using COUCH cms.
i am using the nested_pages tag
here is my code in index.php
- Code: Select all
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Welcome to Kanaan Global School</title>
<link href="bootstrap/bootstrap.min.css" rel="stylesheet">
<!-- custom css -->
<link href="css/style.css" rel="stylesheet">
</head>
<cms:template clonable='1' nested_pages='1'>
</cms:template>
<cms:if k_is_page>
<!-- Single page being visited. Show contents of its editable regions -->
<cms:else />
<!-- List view. Show a listing of pages -->
<body>
<div class="container">
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-1">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button> <!-- for mobile device -->
</div>
<div class="collapse navbar-collapse" id="navbar-collapse-1">
<cms:nested_pages masterpage='index.php' extended_info='1' >
<cms:if k_level_start >
<cms:if k_level='0'>
<ul class='nav navbar-nav' >
<cms:else /> <ul class='dropdown-menu' role='menu'>
</cms:if>
</cms:if>
<cms:if k_element_start >
<cms:if k_immediate_children ='0'>
<li>
<a href="<cms:show k_menu_link />"> <cms:show k_nestedpage_title /></a>
<cms:else /> <li class="dropdown"> <a href="#" class="dropdown-toogle" data-toogle="dropdown"><cms:show k_nestedpage_title /><span class="caret"></span></a>
</cms:if>
</cms:if>
<cms:if k_element_end ></li></cms:if>
<cms:if k_level_end ></ul></cms:if>
</cms:nested_pages>
</div> <!-- end of navbar collapse -->
</div> <!--end of container -->
</div> <!--end of navbar -->
</div><!--end of container -->
</body>
</cms:if>
<?php COUCH::invoke(); ?>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
the problem is the dropdown does not work.
help please?
here is the code without couch integration.
- Code: Select all
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-1">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button> <!-- for mobile device -->
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="dropdown">
<a class="navbar-brand dropdown-toggle" data-toggle="dropdown" href="#">KGS-Portal <span class="caret"></span></a>
<ul>
<li><a href="../jibas">Jibas</a></li>
<li><a href="http://edu.mconline.sg">Mc-Online</a></li>
<li><a href="http://www.worldbookonline.com/wb/products?ed=all&gr=Welcome+Kanaan+Global+School+Jambi%21">World Book</a></li>
</ul>
</li>
<li><a href="index.php">Home</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">About Us <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="Mission-vision.php">Visi & Misi</a></li>
<li><a href="history.php">History</a></li>
<li><a href="#">Partner</a></li>
<li><a href="facility.php">Facility</a></li>
<li><a href="#">School Profile</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Academic <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">TK</a></li>
<li><a href="#">SD</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"> KGS Comunnity <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">PTA</a> </li>
<li><a href="#">Merchandise</a></li>
<li><a href="#">Tips & Trik</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Press <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">News</a></li>
<li><a href="#">Event</a></li>
<li><a href="calender-academic.php">School Calender</a></li>
<li><a href="#">Prestasi sekola</a></li>
</ul>
</li>
<li><a href="#">Mading</a></li>
<li><a href="#"> Contact Us</a></li>
</ul> <!-- end of nav bar list -->
</div><!-- /.navbar-collapse -->
</div><!--end of navbar container-->
</div> <!--end of navbar -->
without couch, it works perfectly.
please help..