Forum for discussing general topics related to Couch.
6 posts Page 1 of 1
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

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 &amp; 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 &amp 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..
Hi,

Except for the misspellings -
class="dropdown-toogle" data-toogle="dropdown"
- rest of the code should output almost exactly the original menu.

Please place your original code and the Couch generated code side-by-side and compare them. You'll easily see what part of the markup has come out different. Should be sufficient to know the problem.

Hope this helps.
oh my..


stupid me. been staring at it for almost a day and cant figure out.

thanks alot kk.
Happens to all of us, Billy :)
hi kk,,

just wondering.

Is it possible that if i have a clonable template , about-us.php

and i have page, facilities.php, that has similar layout as the about-us.php
however the content is a little different than the rest of the cloned page as it contains images where the rest of the cloned page doesnt contain image.

is it possible that i use about-us.php as template however only in in facilities cloned page have editable content type image?

thanks,
Billy,

The primary purpose of a template is to define editable regions - the markup is secondary (e.g. we can use cms:embed to show the same markup on several templates).

So, if I understood your question right, if you use about-us.php as the template. all cloned pages of it will carry the same regions.

Hope that answers your query.
6 posts Page 1 of 1
cron