Twitter Bootstrap Navigation Tabs With Autonav

Permalink 1 user found helpful
I've been trying to use the Twitter Bootstrap tabs ( with c5, but I'm not adept enough at PHP to get the autonav block to output the correct markup. It should be like this...
<ul class="tabs">
   <li class="active"><a href="#">Home</a></li>
   <li><a href="#">Profile</a></li>
   <li><a href="#">Messages</a></li>
   <li><a href="#">Settings</a></li>
   <li><a href="#">Contact</a></li>
   <li class="dropdown" data-dropdown="dropdown">
      <a href="#" class="dropdown-toggle">Dropdown</a>
      <ul class="dropdown-menu">
         <li><a href="#">Secondary link</a></li>
         <li><a href="#">Something else here</a></li>
         <li><a href="#">Another link</a></li>

Any suggestions?

View Replies:
JohntheFish replied on at Permalink Reply
There is a better output template for autonav that is clearer and easier to adapt. See:


for a starting point on how to override the default.
facerX replied on at Permalink Reply
I tried to use jordanlevs autonav template, but it indiscriminately assigns a class to "items" with child pages, but I need to assign different classes to the li, a, and ul as you can see in the code above.
JohntheFish replied on at Permalink Reply
I wasn't suggesting that this view would solve your problems, but that it would be a better starting point for modifying the php into what you re trying to achieve.
tlloyduk replied on at Permalink Reply

I had the same problem but managed to figure it out (not sure its the best way, but it works for me) using code from

Put this in your www_root/blocks/autonav/view.php file

 defined('C5_EXECUTE') or die(_("Access Denied."));
 // get the list of all pages matching the selection
 $aBlocks = $controller->generateNav();
 $nh = Loader::helper('navigation');
 echo("<ul class=\"nav\">");
 // loop through all the pages
 foreach($aBlocks as $ni) {
  $_c = $ni->getCollectionObject();
  // get the level of the current element.
  // This is necessary to create the proper indentation.
  $thisLevel = $ni->getLevel();
  // the current page has a higher level than the previous
  // page which means that we have to print another UL
  // element to indent the next pages

Hope it helps. If anyone can improve it please do so :-D
tlloyduk replied on at Permalink Reply
Ooops just noticed you wanted it for Bootstrap Tabs. Well, same principle applies just need to change the classes as the above code is for the Drop Down Menu in Twitter Bootstrap 2