LIMITING THE AMOUNT OF COLUMNS IN A SINGLE ROW IMAGE DISPLAY - Aug 3rd, 2010


Here’s a suggestion from Interactive Tools’ Dave Edis:

The CSS way is to have each image in a div that has something like: style="float: left; width: 200px". This will make
them flow from left to right and wrap when they run out of space (you can put them inside a bigger fixed width
container).

Or with a table you can have one table cell per image and insert a closing and opening TR every X images. Here's a code
snippet that does that:



<?php $maxCols=2; if (@++$count % $maxCols == 0): ?></tr><tr><?php endif; ?>



Which is just a way of saying "Every 2 images insert "</tr><tr>"".



Here’s a single row example using the thumbnail2 image as a link to a detail page, separate Title and Subtitle fields,
a hidden border for IE and a fixed height for the image cell so that everything lines up nicely.



<table width="100%" border="0" cellpadding="5">
<tr>
<?php foreach ($your_sectionRecords as $record): ?><?php foreach ($record['image'] as $upload): ?>
<td align=”center” height="350" valign="bottom">
<a href="<?php echo $record['_link'] ?>"><img src="<?php echo $upload['thumbUrlPath2'] ?>" width="<?php echo
$upload['thumbWidth2'] ?>" height="<?php echo $upload['thumbHeight2'] ?>" alt="" style="border:hidden" /><br /><div
align="center" class="medium-title"><?php echo $record['title'] ?></div>
<div align="center" class="medium-text"><?php echo $record['sub_title'] ?></div></a>
</td>
<?php $maxCols=2; if (@++$count % $maxCols == 0): ?></tr><tr><?php endif; ?>
<?php endforeach ?><?php endforeach ?>
</tr>
</table>



Similarly, if you’re not using images this code will output a </tr><tr> after every 2 <td>...your content...</td>
lines:



<table border="1">
<tr>

<?PHP foreach ($yourrecords as $record): ?>
<td>
<?PHP echo $record['your_content'] ?><br />
</td>
<?PHP $maxCols=2; if (@++$count % $maxCols == 0): ?></tr><tr><?PHP endif; ?>
<?PHP endforeach; ?>
</tr>
</table>



Use your own variable names instead of $yourrecord, but the inserted code can stay the same.



The materials on this web site have been created for use with CMS Builder content management software. CMS Builder software is published and licensed for use by InteractiveTools.com. Please contact Interactive Tools for information on the downloading of the software or the purchasing of licenses.


Terms of Service