@uhogorlonos

Можно ли сделать Bootstrap tabs на Pdomenu за один вызов?

У Bootstrap есть удобный элемент - табы. Он состоит из 2-х частей: сами табы (переключатели) и область содержимого, которая меняется в зависимости от нажатого таба.
<nav>
  <div class="nav nav-tabs" id="nav-tab" role="tablist">
    <button class="nav-link active" id="nav-home-tab" data-bs-toggle="tab" data-bs-target="#nav-home" type="button" role="tab" aria-controls="nav-home" aria-selected="true">Home</button>
    <button class="nav-link" id="nav-profile-tab" data-bs-toggle="tab" data-bs-target="#nav-profile" type="button" role="tab" aria-controls="nav-profile" aria-selected="false">Profile</button>
    <button class="nav-link" id="nav-contact-tab" data-bs-toggle="tab" data-bs-target="#nav-contact" type="button" role="tab" aria-controls="nav-contact" aria-selected="false">Contact</button>
  </div>
</nav>
<div class="tab-content" id="nav-tabContent">
  <div class="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab">...</div>
  <div class="tab-pane fade" id="nav-profile" role="tabpanel" aria-labelledby="nav-profile-tab">...</div>
  <div class="tab-pane fade" id="nav-contact" role="tabpanel" aria-labelledby="nav-contact-tab">...</div>
</div>

Так как и в первом и втором блоке нужно обернуть соответствующим кодом все пункты генерируемого меню, то я делал это с помощью 2-х вызовов Pdomenu - для верха и низа. А можно ли сделать за один вызов и как?
  • Вопрос задан
  • 60 просмотров
Пригласить эксперта
Ответы на вопрос 1
alelunegov
@alelunegov
Фрилансер. Разработка сайтов на MODX, верстка
Через pdoMenu только два вызова. Если используете шаблонизатор Fenom, то можно сделать через него 1 запрос к базе данных. Пример:
{var $resources = $_modx->getResources(
    ['published' => 1, 'deleted' => 0],
    ['sortby' => 'id', 'sortdir' => 'ASC', 'limit' => 50]
)}

А потом дважды пройтись по массиву циклами. Примерно вот так:
{foreach $resources as $resource}
    {$_modx->getChunk('@INLINE <p>{$id} {$pagetitle}</p>', $resource)}
{/foreach}
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы