How to correctly display a menu using django-mptt?

Question

Django

Help to form the code for the correct display of the menu.
There are 4 items (Main, Types of transportation, Companies, Contacts) menu. Item Types of transportation contains 3 sub-items (road, sea, air).

<ul class="header_ul navbar-nav mt-2 mt-lg-0">
                      <li class="nav-item active">
                          <a class="" href="">Главная</a>
                      </li>
                      <li class="nav-item dropdown">
                          <a class="dropdown-toggle" href="/port.html" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Типы перевозок</a>
                          <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                            <a class="dropdown-item" href="#">Море</a>
                            <a class="dropdown-item" href="#">Воздух</a>
                            <a class="dropdown-item" href="#">Авто</a>
                          </div>
                      </li>
                      <li class="nav-item">
                          <a class="" href="/companys.html">Компании</a>
                      </li>
                      <li class="nav-item">
                          <a class="" href="/contact.html">Контакты</a>
                      </li>
                  </ul>

I just can’t give my mind and display sub-items in the types of transportation.

Answer 1

Place in the documentation:
https://django-mptt.readthedocs.io/en/latest/tutor...
An example of using it in an online store to display a drop-down product catalog:
https://github.com/ri-gilfanov/python- t/blob/maste...
If you're too lazy to read the entire template, here's a summary:

{% load static mptt_tags %}

{% recursetree category_tree %}
    <li>
        <a class="btn btn__light" href="{% url 'category' node.pk %}">
            <span style="flex: 1 1 auto;">{{ node.name }}</span>{% if not node.is_leaf_node %}
            <span>&nbsp;</span><span class="fa fa-angle-right"></span>{% endif %}
        </a>
        {% if not node.is_leaf_node %}
            <ul  class="site_nav_primary__submenu ul__column white_box">
                {{ children }}
            </ul>
        {% endif %}
    </li>
{% endrecursetree %}

The category_tree template variable is a category tree generated in the context processor, you can see it here:
https://github.com/ri-gilfanov/python-t/blob/maste...
And the category model can be found here:
https ://github.com/ri-gilfanov/python-t/blob/maste...
In the markup from the template above, each element of the category tree is called a node. In general, this is a normal Django ORM model object.
Let's say link generation:
One of the urls.py has a route named category that takes a category id. Normally, node.pk and node.id are the same, but I prefer .pk to be independent of the actual primary key name.
And here is the snippet from the snippet above:

{% if not node.is_leaf_node %}
    <ul  class="site_nav_primary__submenu ul__column white_box">
        {{ children }}
    </ul>
{% endif %}

...means the following. If the top-level node contains child nodes, then we make nested bulleted lists (ul) with special CSS styles, and the {{ children }} variable means that inside the tags, with each child element, everything will happen the same as with top level nodes.
If the pseudocode is in Russian:

{% рекурсивное_дерево дерева_категорий %}
    Открываем HTML-теги для узлов верхнего уровня
    и что-то делаем с узлами верхнего уровня.
        {% если узел верхнего уровня содержит дочерние узлы %}
            открываем html-теги, в которые хотим завернуть дочерние узлы
                {{ дети }}
            закрываем html-теги
        {% конец если про детей %}
    Если нужно, ещё что-то делаем с узлами верхнего уровня
    и закрываем HTML-теги.
{% конец рекурсивного дерева %}

True, in the example from the online store, I check for the presence of child nodes twice.
The first time I use it is to add an arrow icon to the "not childless" nodes, so that the user knows that they can hover and the child categories will drop out.
Thus, this check can be used in different places, if you need to style bridles with children and knots without children differently.
I apologize if I stated it a little confusingly. However, you can understand all the features of django-mptt in one evening. There is documentation, and if you have difficulties with English, you can use online translators.