Как добавить третий уровень меню категории в dotLiquid

Question

Я работаю в программе Comarch E-sklep, созданной Comarch, где я использую язык dotLiquid для изменения шаблона магазина.Мне нужна помощь, чтобы показать 3-й уровень категорий.Стандартный скрипт dotLiquid позволяет получить только два уровня меню.В документации я прочитал, что мне нужно ввести специальный код javascript, но я не знаю, как это выразить.Потому что я уже начал изучать js и не все понимаю.

<h2>Menu</h2>
{% assign groupNodes = page.GroupNodes %}
<ul>
  {% for menuTreeOne in groupNodes -%}
    <li><a href="{{ menuTreeOne.Url }}">{{ menuTreeOne.Name }}</a>
      {% if menuTreeOne.Nodes -%}
      <span style="color: lightblue;"> yes </span><br>
          
          <ul>
          {% for menuTreeTwo in menuTreeOne.Nodes -%}
          <li><a href="{{ menuTreeTwo.Url }}">{{ menuTreeTwo.Name }}</a></li>
          {% endfor -%}
          </ul>
  
      {% else %}
      <span style="color: red;"> nope </span>
      {% endif -%}
  </li>
{% endfor -%}
 </ul>

Фрагмент из документации:

Действие GET

Это действие позволяет загружать данные с сервера для создания, дляНапример: хлебные крошки или меню.

Получить / Группы

Получает подгруппы для указанной группы.Это действие позволяет создавать динамическое меню или хлебные крошки.

<script type="text/javascript">
 (function () {
 $(function () {
 $('nav.breadcrumbs>ol>li').hover( 
 function () { 
 var t = $(this), gId = ('' + t.data('id')).split(',')[1]; 
 if (gId && t.find('ol').length == 0) { 
 $.get(null, { __action: 'Get/Groups', groupId: gId, languageId: __lngId }, function (d) { 
 var obj = d.action.Object; 
 if (obj.length) { 
 var ol = $('<ol></ol>'); 
 t.append(ol); 
 $.each(obj, function (i, el) { 
 var a = $('<a></a>').attr('href', el.Url).text(el.Title); 
 ol.append(a); 
 a.wrap('<li></li>') 
});
}
});
}
 else t.find('ol').show(); 
},
 function () { 
 $(this).find('ol').hide(); 
}
);
});
 })(jQuery); 
</script>