[SOLVED] Hulp bij Bootstrap Menu Template

[brentnl]

Ik had een bootstrap framework voor CMSMS gedownload, maar nu blijkt dat die gebasseerd is op een oudere versie van bootstrap. Nu wil ik dus zelf aan de slag met de nieuwste versie, maar ik loop vast bij het menu.

Dit is een gedeelte van de code zoals de output zou moeten zijn;

Code: Select all

<div class="nav-collapse navbar-responsive-collapse collapse" style="height: 0px;">
           <ul class="nav">
             <li class="active"><a href="#">Home</a></li>
             <li><a href="#">Link</a></li>
             <li><a href="#">Link</a></li>
             <li class="dropdown">
              <a data-toggle="dropdown" class="dropdown-toggle" href="#">Dropdown <b class="caret"></b></a>
                        <ul class="dropdown-menu">
                          <li><a href="#">Action</a></li>
                          <li><a href="#">Another action</a></li>
                        </ul>
              </li>
             </ul>
       </div>

Is er iemand die mij op de goede weg krijgt met het omzetten naar een CMSMS menu template?

[velden]

Gebruik de zoekfunctie van dit forum!

Bijvoorbeeld http://forum.cmsmadesimple.org/viewtopi ... te#p306033

[brentnl]

Had de zoekfunctie rechtsboven gebruikt in plaats van die van het forum ... Vandaar dat ik het niet kon vinden ..

Heb met behulp van Calguys code wel het beoogde resultaat kunnen halen en ook een responsive variant van het menu ingebouwd, zoals dat in bootstrap zit.

Voor de geïnteresseerde:

Code: Select all

{* Note1: bootstrap v3 does not natively support more than 2 levels of nav so call with number_of_levels=2 for performance *}
{* Note2: add the loadprops=0 param for performance, this template does not need extended params *}
{* Note3: Pages with children will behave like section headers, and not be navigable.. this is also default behavior with boostrap v3, investigate the css to activate the dropdown on hover instead of click *}

{if $count > 0}
<div class="navbar navbar-default" role="navigation">
      <div class="container">
        <div class="navbar-header">
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                  </button>
        </div>
 <div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
{foreach from=$nodelist item=node}
  {if $node->depth > $node->prevdepth}
    {repeat string='<ul class="dropdown-menu">' times=$node->depth-$node->prevdepth}
  {elseif $node->depth < $node->prevdepth}{repeat string='</li></ul>' times=$node->prevdepth-$node->depth}
    </li>
  {elseif $node->index > 0}</li>
  {/if}

  {$classes=''}
  {if $node->parent == true or $node->current == true}
    {$classes='active'}
    {if $node->parent== true}{$classes=$classes|cat:' parent'}{/if}
  {/if}

  {if $node->type == 'sectionheader'}
    {if $node->haschildren == true}
      <li class="dropdown {$classes}"><a class="dropdown-toggle {$classes}" data-toggle="dropdown"><span>{$node->menutext}</span></a>
    {else}
      <li class="nav-header">{$node->menutext}</li>
    {/if}
  {elseif $node->type == 'separator'}
    <li style="divider">
  {elseif $node->haschildren == true}
    <li class="dropdown {$classes}"><a class="dropdown-toggle {$classes}" data-toggle="dropdown" {if $node->target}target="{$node->target}" {/if}
    href="{$node->url}"><span>{$node->menutext}</span> <b class="caret"></b></a>
  {else}
    <li class="{$classes}"><a class="{$classes}" {if $node->target}target="{$node->target}" {/if}
    href="{$node->url}"><span>{$node->menutext}</span></a>
  {/if}

{/foreach}
{repeat string='</li></ul>' times=$node->depth-1}

</li>
</ul>
      </div>
    </div>
    
</div>
{/if}

[rodeto]

Hallo brentnl, is het jou ook gelukt om de children van een pagina goed naar voren te krijgen?
Dat is nl waar ik tegenaan loop. Op basis van deze template krijg ik alleen de eerste pagina te zien en onderliggende pagina's komen niet naar voren. Geen idee waar het mis gaat bij mij.
Wellicht kun je me helpen.

[brentnl]

Hallo brentnl, is het jou ook gelukt om de children van een pagina goed naar voren te krijgen?
Dat is nl waar ik tegenaan loop. Op basis van deze template krijg ik alleen de eerste pagina te zien en onderliggende pagina's komen niet naar voren. Geen idee waar het mis gaat bij mij.
Wellicht kun je me helpen.

Uh, level 2 bedoel je? Die werkt bij mij gewoon met bovenstaande template. Krijg je een dropdown menu, wat ook responsive goed werkt.

Weet je zeker dat je de laatste versie van bootstrap en de bijbehorende CSS hebt geïnstalleerd?

[rodeto]

Alles nogmaals (voor de zekerheid) geupload. Mijn eigen custom css file eruit gehaald. Veranderde niks.
Blijkt dat ik zelf een fout heb gemaakt in mijn template waardoor een en ander niet goed over is gekomen.

Dat aangepast en de template werkt inderdaad perfect! Kost even wat tijd maar dan heb je ook wat

Mea Culpa.