Вывод товаров в слайдах по 4 штуки pdoResources

Доброго дня. Снова за советом. Столкнулся с парой вопросов. Тыкаюсь несколько дней и пока безуспешно.

1. Задача вывести в слайдере товары. Каждый слайд обернут в контейнер, внутри которого выводятся по 4 товара. Соответственно, если сделать вызов msProducts или pdoPage сначала сладов, в чанках которых будет еще по вызову товаров это неправильно. К тому же, надо, чтобы товары в своем количестве выводились по 4 штуки. В первом слайде с1-4, во втором с 5-8 и т.д. Как это можно сделать?
Задача вывести товары в болоке магазина на minishop2 с меткой «Новинка».

Схематика такая:


Вывожу так:
[ [! msProducts?
&limit=`18`
&parents=`5,6,17`
&depth=`10`
&includeThumbs=`medium`
&includeTVs=`1`
&processTVs=`1`
&tpl=`smallSlidesTpl`
&includeContent=`1`
&where=` { " Data.new ": " 1 " } `
] ]

2. Второй вопрос тоже про вывод товаров в табах.
Есть такой фильтр:

При нажатии на кнопки ДЛЯ НЕЕ, ДЛЯ НЕГО и ЭКСКЛЮЗИВ должны выводится под ними товары из соответствующей категории.
Верстка с вызовом такая:

<div class="product-tab-nav mb-35">
            <div class="row align-items-center">
                <div class="col-12">
                    <div class="section-title text-center mb-30">
                        <h2 class="title text-dark">Категории товаров</h2>
                        <p class="text mt-10">Найди подходящий вариант</p>
                    </div>
                </div>
                <div class="col-12">
                    <nav class="product-tab-menu theme1">
                        <ul class="nav nav-pills justify-content-center" id="pills-tab" role="tablist">
                            <li class="nav-item">
                                <a class="nav-link active" id="pills-home-tab" data-toggle="pill" href="#for-her"
                                    role="tab" aria-controls="pills-home" aria-selected="true">Для нее</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#for-him"
                                    role="tab" aria-controls="pills-profile" aria-selected="false">Для него</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" id="pills-contact-tab" data-toggle="pill" href="#exclusive"
                                    role="tab" aria-controls="pills-contact" aria-selected="false">Эксклюзив</a>
                            </li>
                        </ul>
                    </nav>
                </div>
            </div>
        </div>
        <!-- product-tab-nav end -->
        <div class="row">
            <div class="col-12">
                <div class="tab-content" id="pills-tabContent">
                    <!-- first tab-pane -->
                    <div class="tab-pane fade show active" id="for-her" role="tabpanel"
                        aria-labelledby="pills-home-tab">
                        <div class="product-slider-init theme1 slick-nav">
                          [ [ ! msProducts?
                          &groupby=`msCategory.id`
                          &parents=`5`
                          &includeThumbs=`medium`                     
                          &includeTVs=`1`
                          &tpl=`slideProductTplUp`
                          &tplOdd=`slideProductTplDown`
                          &includeContent=`1`
                          ] ]
                        </div>
                    </div>
                    <!-- second tab-pane -->
                    <div class="tab-pane fade" id="for-him" role="tabpanel" aria-labelledby="pills-profile-tab">
                        <div class="product-slider-init theme1 slick-nav">
                            [ [ ! msProducts?
                            &groupby=`msCategory.id`
                            &limit=`50`
                            &parents=`6`
                            &includeThumbs=`medium`                     
                            &includeTVs=`1`
                            &tpl=`slideProductTplUp`
                            &tplOdd=`slideProductTplDown`
                            &includeContent=`1`
                            ] ]
                        </div>
                    </div>
                    <!-- third tab-pane -->
                    <div class="tab-pane fade" id="exclusive" role="tabpanel" aria-labelledby="pills-contact-tab">
                        <div class="product-slider-init theme1 slick-nav">
                          [ [ ! msProducts?
                          &groupby=`msCategory.id`
                          &limit=`50`
                          &parents=`17`
                          &includeThumbs=`medium`                     
                          &includeTVs=`1`
                          &tpl=`slideProductTplUp`
                          &tplOdd=`slideProductTplDown`
                          &includeContent=`1`
                          ] ]
                        </div>
                    </div>
                </div>
            </div>
        </div>

Почему-то не выводятся, либо не реагируют на нажатие кнопки табов. Может не допустимо делать несколько вызовов?
Пробовал через pdoPage и тоже не получилось. Прежде как-то раз получилось, но во всех категориях выводились все товары магазина без разбора.
Спасибо.

2 комментария

avatar
Попробуйте swiperjs.com/demos/
  • 3fir
  • 0
avatar
Спасибо)) В том и задача, чтобы оставить именно оригинальную верстку(
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.