0

I've three main menus, like "About", "Organisation", and "For us"

For the main menu About, it has three sub menus, they are "About You", "About Us", and "About the people around you". I've created a twig like menu--main--main-navigation.html.twig

In this i've tried to include this code, but it gives the first main menu, its sub menus, also second sub menus (sub main menu doesn't show up).

How do I do this

    {% import _self as menus %}

{{ menus.menu_links(items, attributes, 0) }}

{% macro menu_links(items, attributes, menu_level) %}
  {% import _self as menus %}
  {% if items %}
    {% if menu_level == 0 %}
      <ul class="main-menu full-width relative-position center-container">
    {% else %}
      <ul class="sub-menu full-width">
    {% endif %}
    {% for key,item in items %}
      {#{{ kint(key) }}#}
      {#{{ kint(item) }}#}
          <!-- First coloumn -->
          <li class="col-1 relative-position">
            {% set title %}
              {{ item.title|striptags('<i>, <a>')|raw }}
            {% endset %}
            {{ link(title, item.url) }}
            {% if item.below %}
              {{ menus.menu_links(item.below, attributes, menu_level + 1) }}
            {% endif %}
          </li>
    {% endfor %}
      </ul>
    {% endif %}
  {% endif %}

{% endmacro %}
0

You need to create menu--main.html.twig template and add below code.

{#
 /**
  * @file
  * Default theme implementation to display a menu.
  *
  * Available variables:
  * - menu_name: The machine name of the menu.
  * - items: A nested list of menu items. Each menu item contains:
  *   - attributes: HTML attributes for the menu item.
  *   - below: The menu item child items.
  *   - title: The menu link title.
  *   - url: The menu link url, instance of \Drupal\Core\Url
  *   - localized_options: Menu link localized options.
  *   - is_expanded: TRUE if the link has visible children within the current
  *     menu tree.
  *   - is_collapsed: TRUE if the link has children within the current menu tree
  *     that are not currently visible.
  *   - in_active_trail: TRUE if the link is in the active trail.
  *
  * @ingroup themeable
  */
  #}
  {% import _self as menus %}
  {#
    We call a macro which calls itself to render the full tree.
    @see http://twig.sensiolabs.org/doc/tags/macro.html
  #}
  {{ menus.menu_links(items, attributes, 0) }}
    {% macro menu_links(items, attributes, menu_level) %}
      {% import _self as menus %}
        {% if items %}
          {% if menu_level == 0 %}
             <ul{{ attributes.addClass('nav navbar-nav') }}>
          {% else %}
             <ul {{ attributes.addClass('submenu dropdown-menu') }}>
          {% endif %}
             {% for item in items %}
               <li{{ item.attributes }}>
                 {{ link(item.title, item.url) }}
                 {% if item.below %}
                   {{ menus.menu_links(item.below, attributes, menu_level + 1) }}
                 {% endif %}
              </li>
            {% endfor %}
            </ul>
         {% endif %}
      {% endmacro %}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.