Laying out 4 products when 4th product has a different CSS Class

Hi benedict,

To add a specific class to every fourth image, count the number of times you've run the loop. If the number hits four, add the special class and reset the counter.

This first snippet is the (generalized) method for displaying multiple products with one image each:
<ul class="clearfix">
<?php $counter = 0; ?>
<?php foreach ($products as $product) : ?>
<li class="product<?php if ($counter == 4 ) { $counter = 0; echo " last"; } ?>">
<a href="<?php echo $product['_link']; ?>" class="thumb"><img src="<?php echo $product['uploads'][0]['thumbUrlPath']; ?>" alt="" /></a>
<a href="<?php echo $product['_link']; ?>" class="title"><?php echo $product['name']; ?></a>
<div class="clearfix info">
<a href="#" class="add-to-cart">READ MORE</a>
</div>
</li>
<?php $counter = $counter + 1; ?>
<?php endforeach; ?>
</ul>

This next snippet is for multiple images per product:
<?php $uploads = $product['uploads']; ?>
<ul class="clearfix">
<?php $counter = 0; ?>
<?php foreach ($uploads as $upload) : ?>
<li class="product<?php if ($counter == 4 ) { $counter = 0; echo " last"; } ?>">
<a href="<?php echo $product['_link']; ?>" class="thumb"><img src="<?php echo $uploads['thumbUrlPath']; ?>" alt="" /></a>
<a href="<?php echo $product['_link']; ?>" class="title"><?php echo $product['name']; ?></a>
<div class="clearfix info">
<a href="#" class="add-to-cart">READ MORE</a>
</div>
</li>
<?php $counter = $counter + 1; ?>
<?php endforeach; ?>
</ul>

In the first case, the products are loaded via getRecords with no limit on the returned result set and in the second case you would add "'limit' => 1," to the options array for the function.

Remember, these two instances are generalized so you may need a few changes to suit your particular site/variable names etc.

Let me know if this helps,

Tom