When using CListView to display multiple views next to each other, we can use the $index variable inside the viewFile to achieve this. As far as i know there is no extension or out-of-the-box functionality for this, so we need to apply a little hack:
Assume we use twitter bootstrap, we have this html structure to be generated:
<div class="container"> <div class="span12"> <div class="row"> <div class="span4"> CONTENT </div> <div class="span4"> CONTENT </div> <div class="span4"> CONTENT </div> </div> </div> </div>
and so on. Do the following in your viewFile:
$pageSize = $widget->dataProvider->getPagination()->pageSize; <?php if($index == 0) echo '<div class="row">'; <div class="span3"> // Your content goes here </div> <?php if($index != 0 && $index != $pageSize && ($index + 1) % 4 == 0) echo '</div><div class="row">'; <?php if(($index + 1) == $pageSize ) echo '</div>';
Make sure to adjust the %4 and span3 to how much columns you want
2 columns: span:6 %: 2 3 columns: span:4 %: 3 4 columns: span:3 %: 4 6 columns: span:2 %: 6
and so on.