Thank you very much for your answer, but this should be needed maybe little more explanation on the example below.
My target is understating this code and learn writing any structure from the drop-down menus. This work for Simplex menu or some CSS menu.
Code: Select all
{* simple navigation *}
{* note, function can only be defined once *}
{*
variables:
node: contains the current node.
aclass: is used to build a string containing class names given to the a tag if one is used
liclass: is used to build a string containing class names given to the li tag.
*}
{function name=Nav_menu depth=1}{strip}
{if $depth ==0}
<ul class="nav navbar-nav">
{else}
<ul class="dropdown-menu">
{/if}
{if $depth ==3}
<li class="dropdown dropdown-submenu">
{else}
<li class="">
{/if}
{foreach $data as $node}
{* setup classes for the anchor and list item *}
{assign var='liclass' value='menudepth'|cat:$depth}
{assign var='aclass' value='dropdown-item'}
{* the first child gets a special class *}
{if $node@first && $node@total > 1}{assign var='liclass' value=$liclass|cat:' first_child'}{/if}
{* the last child gets a special class *}
{if $node@last && $node@total > 1}{assign var='liclass' value=$liclass|cat:' last_child'}{/if}
{if $node->current}
{* this is the current page *}
{assign var='liclass' value=$liclass|cat:' menuactive'}
{assign var='aclass' value=$aclass|cat:' menuactive'}
{/if}
{if $node->parent}
{* this is a parent of the current page *}
{assign var='liclass' value=$liclass|cat:' menuactive menuparent'}
{assign var='aclass' value=$aclass|cat:' menuactive menuparent'}
{/if}
{if $node->children_exist}
{assign var='liclass' value=$liclass|cat:' parent'}
{assign var='aclass' value=$aclass|cat:' parent'}
{/if}
{* build the menu item node *}
{if $node->type == 'sectionheader'}
<li class='sectionheader {$liclass}'><span>{$node->menutext}</span>
{if isset($node->children)}
{Nav_menu data=$node->children depth=$depth+1}
{/if}
</li>
{else if $node->type == 'separator'}
<li class='separator {$liclass}'><hr class='separator'/></li>
{else}
{* regular item *}
{if isset($node->children)}
<li class="nav-item dropdown"><a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">{$node->menutext}<span class="caret"></span></a>
{Nav_menu data=$node->children depth=$depth+1}
</li>
{else}
<li class=""><a class="{$aclass}" href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a></li>
{/if}
{/if}
{/foreach}
</ul>
{/strip}{/function}
{if isset($nodes)}
{Nav_menu data=$nodes depth=0}
{/if}
Html for 3 level nav menu
Code: Select all
<ul class="dropdown-menu show">
<li class="dropdown dropdown-submenu">
<a href="#" class="dropdown-item" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">About</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="../../../html/default/pages/about-1.html">About 1</a></li>
</ul>
</ul>