Navigation with different submenu layout

Support Themes & Styling
1

I need a navigation with different layouts at the submenus. How can i do this:

<nav>
<ul>
<li><a href="/">Home</a></li>
<ul class="dropdown-menu">
        <li class="dropdown-submenu"><a href="#"><i class="fa fa-heart"></i>Submenu</a>
                     <ul class="dropdown-menu">
                           <li><a href="#">Menuitem</a></li>
                            <li class="dropdown-submenu"><a href="#">Menuitem with sub</a>
                                                        <ul class="dropdown-menu">
                                                            <li><a href="#">......</a></li>

At the moment i use this:

{% macro loop(page) %}
    {% for p in page.children.visible %}
        {% if p.children.visible.count > 0 %}
            <li class="dropdown">
                <a href="{{ p.url }}">
                    {{ p.menu }}
                </a>
                <ul class="dropdown-menu">
                    {{ _self.loop(p) }}
                </ul>
            </li>
2

I think you are on the right track, basically in that check that is checking for children, you should put dropdown-submenu class on the <li> tag. Your just putting dropdown class currently.

1 Like
3

Hmm…

And how can i do this in the setup?

4

You have to edit that Twig layout you pasted above. You didn’t provide the full paste of the file, so i can’t really show you.

5

Here the full HTML navigation part. My problem is the twig part for the third level menu part

<nav>
	<ul>
		<li class="dropdown">
			<a href="#">First Level Menu Item</a>
			<ul class="dropdown-menu">
				<li class="dropdown-submenu">
					<a href="#">Second Level Menu Item</a>
					<ul class="dropdown-menu">
						<li><a href="#">Third Level Menu Item One</a></li>
						<li><a href="#">Third Level Menu Item Two</a> </li>
					</ul>
				</li>
			</ul>
		</li>
	</ul>
</nav>
6

No one an idea for a solution?

7

So, if I’m reading you right, you wish to create 3 levels deep menu?

Menu

Submenu

Sub-Submenu

8

Yes - i want to create a 3 level deep menu