<ul class="navbar-nav">
<li class="nav-item active">
<a href="#" id="nav-item-1" class="nav-link" title="Home">
<span class="nav-link-text">
Home <span class="sr-only">(current)</span>
</span>
</a>
</li>
</ul>
<ul class="navbar-nav">
<li class="nav-item">
<a href="#" id="nav-item-3" class="nav-link" title="Customizings">
<span class="nav-link-text">
Customizings </span>
</a>
</li>
<li class="nav-item">
<a href="#" id="nav-item-4" class="nav-link" title="Features">
<span class="nav-link-text">
Features </span>
</a>
</li>
<li class="nav-item dropdown dropdown-hover">
<a href="#" id="nav-item-5" class="nav-link dropdown-toggle" title="Pages" aria-haspopup="true" aria-expanded="false">
<span class="nav-link-text">
Pages </span>
</a>
<ul class="dropdown-menu" aria-labelledby="nav-item-5">
<li>
<a href="#" class="dropdown-item" title="Default">
<span class="dropdown-text">
Default </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="2 Columns">
<span class="dropdown-text">
2 Columns </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="2 Columns 25/75">
<span class="dropdown-text">
2 Columns 25/75 </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="2 Columns 50/50">
<span class="dropdown-text">
2 Columns 50/50 </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="2 Columns, Offset Right">
<span class="dropdown-text">
2 Columns, Offset Right </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="3 Columns">
<span class="dropdown-text">
3 Columns </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="Simple">
<span class="dropdown-text">
Simple </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="Subnavigation, Left">
<span class="dropdown-text">
Subnavigation, Left </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="Subnavigation, Left and 2 Columns">
<span class="dropdown-text">
Subnavigation, Left and 2 Columns </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="Subnavigation, Right">
<span class="dropdown-text">
Subnavigation, Right </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="Subnavigation, Right and 2 Columns">
<span class="dropdown-text">
Subnavigation, Right and 2 Columns </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="Feature">
<span class="dropdown-text">
Feature </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="Startpage">
<span class="dropdown-text">
Startpage </span>
</a>
</li>
</ul>
</li>
<li class="nav-item dropdown dropdown-hover">
<a href="#" id="nav-item-6" class="nav-link dropdown-toggle" title="Content Examples" aria-haspopup="true" aria-expanded="false">
<span class="nav-link-text">
Content Examples </span>
</a>
<ul class="dropdown-menu" aria-labelledby="nav-item-6">
<li>
<a href="#" class="dropdown-item" title="Text">
<span class="dropdown-text">
Text </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="Media">
<span class="dropdown-text">
Media </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="Interactive">
<span class="dropdown-text">
Interactive </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="Form elements">
<span class="dropdown-text">
Form elements </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="Menu's">
<span class="dropdown-text">
Menu's </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="Special elements">
<span class="dropdown-text">
Special elements </span>
</a>
</li>
<li>
<a href="#" class="dropdown-item" title="And more...">
<span class="dropdown-text">
And more... </span>
</a>
</li>
</ul>
</li>
</ul>
{% block main %}
{% if menu %}
<ul class="navbar-nav">
{% for item in menu %}
{% if item.spacer %}
</ul>
<ul class="navbar-nav">
{% else %}
{% set itemClassActive = '' %}
{% if item.active %}
{% set itemClassActive = ' active' %}
{% endif %}
{% set itemClassChildren = '' %}
{% if item.children %}
{% set itemClassChildren = ' dropdown dropdown-hover' %}
{% endif %}
<li class="nav-item{{ itemClassActive }}{{
itemClassChildren
}}">
{% set linkClassChildren = '' %}
{% set linkAttributeAria = '' %}
{% if item.children %}
{% set linkClassChildren = ' dropdown-toggle' %}
{% set linkAttributeAria =
'aria-haspopup="true" aria-expanded="false"'
%}
{% endif %}
{% set linkAttributeTarget = '' %}
{% if item.target %}
{% set linkAttributeTarget = ' target="'
~ item.target
~ '"'
%}
{% endif %}
{% set itemDataUid = loop.index %}
<a href="{{ item.link }}"
id="nav-item-{{ itemDataUid }}"
class="nav-link{{ linkClassChildren }}"
title="{{ item.title }}"
{{ linkAttributeTarget }}
{{ linkAttributeAria }}>
{# TODO: {% if theme.navigation.icon.enable and item.icon %}
<span class="nav-link-icon">
{% if item.icon.0.extension == 'svg' %}
<bk2k:inlineSvg image="{item.icon.0}" width="{theme.navigation.icon.width}" height="{theme.navigation.icon.height}" />
{% else %}
<f:image additionalAttributes="{loading: 'lazy'}" image="{item.icon.0}" alt="{item.icon.0.alternative}" title="{item.icon.0.title}" width="{theme.navigation.icon.width}" height="{theme.navigation.icon.height}" />
{% endif %}
</span>
{% endif %} #}
<span class="nav-link-text">
{{ item.title }}{% if item.current %}
<span class="sr-only">(current)</span>
{% endif %}
</span>
</a>
{% if item.children %}
<ul class="dropdown-menu"
aria-labelledby="nav-item-{{ itemDataUid }}">
{% for child in item.children %}
{% if child.spacer %}
<li class="dropdown-divider"></li>
{% else %}
<li>
{% set childClassActive = '' %}
{% if child.active %}
{% set childClassActive =
' active'
%}
{% endif %}
{% set childLinkAttributeTarget =
''
%}
{% if child.target %}
{% set childLinkAttributeTarget = ' target="'
~ child.target
~ '"'
%}
{% endif %}
<a href="{{ child.link }}"
class="dropdown-item{{
childClassActive
}}"
{{ childLinkAttributeTarget }}
title="{{ child.title }}">
{# TODO: {% if theme.navigation.dropdown.icon.enable and child.icon %}
<span class="dropdown-icon">
{% if child.icon.0.extension == 'svg' %}
<bk2k:inlineSvg image="{child.icon.0}" width="{theme.navigation.dropdown.icon.width}" height="{theme.navigation.dropdown.icon.height}" />
{% else %}
<f:image additionalAttributes="{loading: 'lazy'}" image="{child.icon.0}" alt="{child.icon.0.alternative}" title="{child.icon.0.title}" width="{theme.navigation.dropdown.icon.width}" height="{theme.navigation.dropdown.icon.height}" />
{% endif %}
</span>
{% endif %} #}
<span class="dropdown-text">
{{ child.title }}{% if
child.current %}
<span class="sr-only">
(current)
</span>
{% endif %}
</span>
</a>
</li>
{% endif %}
{% endfor %}
</ul>
{% endif %}
</li>
{% endif %}
{% endfor %}
</ul>
{% endif %}
{% endblock %}
{
"bodytext": null,
"categories": null,
"CType": null,
"customId": null,
"date": null,
"frame_class": null,
"header": null,
"header_color": null,
"header_layout": 2,
"header_link": null,
"header_position": null,
"header_style": null,
"layout": null,
"space_after_class": null,
"space_before_class": null,
"space_inner_after_class": null,
"space_inner_before_class": null,
"subheader": null,
"target": null,
"menu": [
{
"title": "Home",
"link": "#",
"target": null,
"active": true,
"current": true
},
{
"spacer": true
},
{
"link": "#",
"title": "Customizings",
"target": null
},
{
"link": "#",
"title": "Features",
"target": null
},
{
"link": "#",
"title": "Pages",
"target": null,
"children": [
{
"link": "#",
"title": "Default",
"target": null
},
{
"link": "#",
"title": "2 Columns",
"target": null
},
{
"link": "#",
"title": "2 Columns 25/75",
"target": null
},
{
"link": "#",
"title": "2 Columns 50/50",
"target": null
},
{
"link": "#",
"title": "2 Columns, Offset Right",
"target": null
},
{
"link": "#",
"title": "3 Columns",
"target": null
},
{
"link": "#",
"title": "Simple",
"target": null
},
{
"link": "#",
"title": "Subnavigation, Left",
"target": null
},
{
"link": "#",
"title": "Subnavigation, Left and 2 Columns",
"target": null
},
{
"link": "#",
"title": "Subnavigation, Right",
"target": null
},
{
"link": "#",
"title": "Subnavigation, Right and 2 Columns",
"target": null
},
{
"link": "#",
"title": "Feature",
"target": null
},
{
"link": "#",
"title": "Startpage",
"target": null
}
]
},
{
"link": "#",
"title": "Content Examples",
"target": null,
"children": [
{
"link": "#",
"title": "Text",
"target": null
},
{
"link": "#",
"title": "Media",
"target": null
},
{
"link": "#",
"title": "Interactive",
"target": null
},
{
"link": "#",
"title": "Form elements",
"target": null
},
{
"link": "#",
"title": "Menu's",
"target": null
},
{
"link": "#",
"title": "Special elements",
"target": null
},
{
"link": "#",
"title": "And more...",
"target": null
}
]
}
]
}
No notes defined.