Categories children in Bootstrap navbar I am trying to put my categories and their children into a Bootstrap navbar. If category has Children it should become a dropdown link.

Here is the code:

{% set categories = craft.categories.group('compositions') %}
&lt;div class="collapse navbar-collapse" id="workCategories"&gt;
  &lt;ul class="nav navbar-nav"&gt;
   {% nav entry in categories %}
    &lt;li&gt;&lt;a href="{{ entry.url }}"&gt;{{ entry.title }}&lt;/a&gt;
     {% ifchildren %}
      &lt;li class="dropdown"&gt;
       &lt;a href="#" class="dropdown-toggle" data-toggle="dropdown"&gt;{{ entry.title }} &lt;span class="caret"&gt;&lt;/span&gt;&lt;/a&gt;
      &lt;ul class="dropdown-menu" role="menu"&gt;
       {% children %}
     &lt;/ul&gt;
&lt;/li&gt;
{% endifchildren %}
&lt;/li&gt;
    {% endnav %}
  &lt;/ul&gt;


It kind of work except that the top categories appear twice:

once with the dropdown and the children (which I want)
and once without the dropdown.

How could I nest those children without repeating them?
I guess it would be easier to use a for-loop instead of that nav-loop in your case. Although it's harder to get multi-level-dropdowns

{% set categories = craft.categories.group('compositions') %}
&lt;div class="collapse navbar-collapse" id="workCategories"&gt;
  &lt;ul class="nav navbar-nav"&gt;
    {% for entry in categories %}
      {% if not entry.hasDescendants() %}
        &lt;li&gt;&lt;a href="{{ entry.url }}"&gt;{{ entry.title }}&lt;/a&gt;&lt;/li&gt;
      {% else %}
        &lt;li class="dropdown"&gt;
          &lt;a href="#" class="dropdown-toggle" data-toggle="dropdown"&gt;{{ entry.title }} &lt;span class="caret"&gt;&lt;/span&gt;&lt;/a&gt;
          &lt;ul class="dropdown-menu" role="menu"&gt;
            {% for child in entry.getDescendants() %}
              &lt;a href="{{ child.url }}"&gt;{{ child.title }}&lt;/a&gt;
            {% endfor %}
          &lt;/ul&gt;
        &lt;/li&gt;
      {% endif %}
  &lt;/ul&gt;
&lt;/div&gt;