MODx создание Bootrap 4 меню с помощью компонента PdoMenu

Вот так выглядит bootstrap 4 меню, взятое с официальной документации.( При верстке мы добавили наши пункты меню.)

<nav class="navbar navbar-expand-md navbar-light main-menu">
<button class="navbar-toggler main-menu_ico" type="button" data-toggle="collapse" data-target="#catalog_menu" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="catalog_menu">
<ul class="navbar-nav">
<li class="nav-item dropdown">

<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button" data-toggle="dropdown" aria-haspopup="false" aria-expanded="true">
Для женщин
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
<a class="dropdown-item" href="#">Style</a>
<a class="dropdown-item" href="#">Платья</a>
<a class="dropdown-item" href="#">День</a>
<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="nav-link" href="#">Для мужчин </a>

</li>
<li class="nav-item">
<a class="nav-link" href="#">Для детей</a>
</li>

<li class="nav-item hidden_menu">
<a class="nav-link" href="#">Доставка и оплата</a>
</li>
<li class="nav-item hidden_menu">
<a class="nav-link" href="#">Возврат </a>
</li>
<li class="nav-item hidden_menu">
<a class="nav-link" href="#">Оптовым покупатеям</a>
</li>
<li class="nav-item hidden_menu">
<a class="nav-link" href="#">Контакты</a>
</li>

</ul>
</div>
</nav>

Согласитесь, что довольна таки сложно за 1 минуту сообразить, как выводить меню с помощью компонента pdomenu. Вот как это делается

[ [pdoMenu?
&level=`2`
&parents=`2`
&firstClass=`0`
&lastClass=`0`
&parentClass=`dropdown`
&outerClass=` navbar-nav`
&levelClass=`submenu`
&tplOuter=`@INLINE <ul [[+classes]]>[[+wrapper]]</ul>`
&tplInner=`@INLINE <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">[[+wrapper]]</div>`
&tplParentRow=`@INLINE <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="[[+link]]" id="navbarDropdownMenuLink" role="button" data-toggle="dropdown" aria-haspopup="false" aria-expanded="true">
[[+pagetitle]]
</a>[[+wrapper]]</li>`
&tplInnerRow=`@INLINE <a class="dropdown-item" href="[[+uri]]">[[+pagetitle]]</a>`
&tpl=`@INLINE <li class="nav-item"><a class="nav-link" href="[[+uri]]">[[+pagetitle]]</a> </li>`
] ]