Please note that the forum isn't realy used anymore.

If you have questions, want support or just simply want to talk to us you can find us on slack.

 

Version 3.6.6 spoon cycle

I got something wierd today with spoon cycle:

{cycle:

<div class="row">: : } and {cycle: : :</div>} seem to working fine. Every third element a new div is inserted and after every third element it is closed.

However when i try this with 4 elements {cycle:

<div class="row">: : : } and {cycle: : : :</div>} it screws up my code and doesnt closed it when it has too. Any ideas?

I d show the problem page of the dev site, but markdown doesnt let me include a link?

Looks like this problem is only caused with the iterations of the photogallery module ...

Hmm I tried this:

{cycle:'open-tag':'':'':''} 
    {$id}
{cycle:'':'close-tag'}

which gave me:

open-tag 1 2 3 4 close-tag open-tag 5 6

So there's no final closing tag. But that's because the final closing tag will be inserted after element 7 & 8. Is this what's happening in your template? Try having an iteration with exactly 4,8,12,16... elements and it will generate a final closing tag.

Hopefully, Fork will have Twig support very soon so we can use the Batch filter which handles this perfectly. For example here with bootstrap.

That is exactly what i m looking for, something with the end tag. You got any other ideas of accomplishing this? see site in dev

Hmm I never used the Cycle tag and I don't use div's to group items into a row. Maybe you can try it with css only? Just one "parent" div with multiple thumbnail elements. Most css/sass frameworks have support for thumbnail grids or just use the span-columns width. This is a work in progress where I created a thumbnail grid. (I used Chopstick's Sass framework.)

Can't you remove the row div's and keep the span elements inside a parent div? But then the thumbnails will fill the whole width of the page. You can maybe group them in a div with 8 of the 12 columns as width.

Setting the width of the images in an element is no problem ( grid system - 12cols) but it is the height that screws it up. The height is variable is if one element is higher than the other it breaks the layout, hence the wrapping row div. voorbeeld

Well i came up with a bit of a dirty solution, it might be helpfull for somebody else too

Warning! Dirty and not efficient workaround ...

$imagesCount = count($items); $imagesLast = $imagesCount-1; $g = 0;

for ($i=0; $i<=$imagesLast; $i++) 
{

$g++;           

$items[$i]['counter'] = $g; 

$items[0]['diverderStart'] = '<div class="row">';               

// deelbaar door 4
if($g%4==0)
{
// na elk 4de element een eindtag
$items[$i]['diverderStart'] = '';
$items[$i]['diverderEnd'] = '</div>';
// elk 5de element beginnen met begintag
}elseif($g%5==0){
$items[$i]['diverderStart'] = '<div class="row">';
$items[$i]['diverderEnd'] = '';
$g = 0;
// niet deelbaar door 4  of geen 5de element
}else{
// laatste element altijd een eindtag
if($i==$imagesLast){
if($i==0){
$items[0]['diverderStart'] = '<div class="row">';
$items[$i]['diverderEnd'] = '</div>';
}else{
$items[$i]['diverderStart'] = '';
$items[$i]['diverderEnd'] = '</div>';
}
// niets plaatsen bij rest
}else{
$items[$i]['diverderStart'] = '';
$items[$i]['diverderEnd'] = '';
}
}
}

I had this problem recently. The last item didn't get a closing tag. I used some jQuery...

var divs = $('.media.partner');
for(var i = 0; i < divs.length; i+=2) {
    divs.slice(i, i+2).wrapAll('<div class="row"></div>');
}

Comment

The forum is deprecated in favor of our Slack channel, which provides real-time support for your issues.

Join us on Slack here: https://fork-cms.herokuapp.com/