pdoResources разбивка результатов по блокам

Всем привет. Столкнулся с такой задачей, нужно на сайте вывести карусель с изображениями и сделать так чтобы в каждом блоке было по 4 изображения. Вот пример:

<div class="item active">
                    <div class="row">
                        <div class="col-sm-3 col-xs-6"><a href="#x"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>
                        <div class="col-sm-3 col-xs-6"><a href="#x"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>
                        <div class="col-sm-3 col-xs-6"><a href="#x"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>
                        <div class="col-sm-3 col-xs-6"><a href="#x"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>
                    </div>
                </div>
                <div class="item">
                    <div class="row">
                        <div class="col-sm-3 col-xs-6"><a href="#x col-xs-6" class="thumbnail"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>
                        <div class="col-sm-3 col-xs-6"><a href="#x" class="thumbnail"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>
                        <div class="col-sm-3 col-xs-6"><a href="#x" class="thumbnail"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>
                        <div class="col-sm-3 col-xs-6"><a href="#x" class="thumbnail"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>
                    </div>
                </div>

Тоесть блок с class=«item» должен повторяться через 4 добавленных изображения. Есть ли стандартное решение без велосипедов?

Вывод пока такой сделал:

[[!pdoResources?
                    &parents=`19,20,21,22,23`
                    &includeTVs=`image`
                    &tplWrapper=`@INLINE <div class="item "><div class="row">[[+output]]</div></div>`
                    &tpl=`@INLINE <div class="col-sm-3 col-xs-6"><a href="#x"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>`
                ]]

SEQUEL.ONE

23 июля 2016, 20:00

3 102

Комментарии: 7

Evgeny Tarasov

24 июля 2016, 02:20

Не очень понятна описана задача.
Можно конкретнее?

SEQUEL.ONE

24 июля 2016, 02:26

<div class="item active">
                    <div class="row">
                        <div class="col-sm-3 col-xs-6"><a href="#x"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>
                        <div class="col-sm-3 col-xs-6"><a href="#x"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>
                        <div class="col-sm-3 col-xs-6"><a href="#x"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>
                        <div class="col-sm-3 col-xs-6"><a href="#x"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>
                    </div>
                </div>

к примеру есть такой кусок кода, в блоке

<div class="row">...</div>

идёт как раз список выводимых ресурсов

<div class="col-sm-3 col-xs-6"><a href="#x"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>

нужно сделать разбивку, чтобы через каждые 4 ресурса подставлялись эти блоки автоматом.

Андрей

24 июля 2016, 09:22

<div class="item active">
	<div class="row">
		[[pdoResources?
			...
			&tpl=`row`
		]]
	</div>
</div>

В чанке row после каждого 4 ставите закрывающие и открывающие дивы

<div class="col-sm-3 col-xs-6"><a href="#x"><img src="http://placehold.it/300x300" alt="Image" class="img-responsive"></a></div>
[[+idx:decr:mod=`4`:is=`3`:then=`</div></div><div class="item"><div class="row">`]]

Может как-то и по другому можно. В том же getResources удобнее сделано, там можно указать чанк для каждого N элемента выборки.

Valery

24 июля 2016, 09:36

В pdoResources тоже работает параметр tpl_n. Попробуйте:
&tpl=`tpl.row` — стандартный чанк,
&tpl_n4=`tpl.row_n4` — чанк 4-го результата, отличается от стандартного добавлением в конце:

</div>
</div>
<div class="item">
	<div class="row">

&tpl_last=`tpl.row` — чанк последнего результата, используем стандартный.
Если я правильно понял вопрос, то все должно получиться и занять всего пару минут.

Владимир Кисилица

24 июля 2016, 10:41

Чанк последнего результата, должен закрыть все открытые теги

Valery

24 июля 2016, 10:59

У меня подразумевается, что div'ы item и row закрываются в общей обертке или за пределами сниппета.
Последний чанк в этом случае как раз должен быть как первый. Но возможны различные манипуляции, естественно. Думаю, используя tpl_n, автор сам быстро разберётся.

SEQUEL.ONE

24 июля 2016, 13:27

Спасибо, только вот почему-то вместо 4рёх картинок в слайдере он разбивает по 3, а не по 4.

Вот так удалось побороть) Огромное спасибо)

[[!pdoResources?
                    &parents=`19,20,21,22,23`
                    &includeTVs=`image,client,cms,logo,url,year,tematic`
                    &tplWrapper=`@INLINE <div class="item active"><div class="row">[[+output]]</div></div>`
                    &tpl=`tpl.SEQUELONE.carouselTpl`
                    &tpl_n5=`tpl.SEQUELONE.carouselTpl.row_n4`
                    &limit=`14`
                    &useFenom=`1`
                    &sortby=`RAND()`
                ]]

Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.