Listings in 2 columns

7 posts by 3 authors in: Forums > CMS Builder
Last Post: March 23, 2009   (RSS)

By wevolutions - November 6, 2008 - edited: November 8, 2008

I know about the line of code to add to get your listings into 2 columns but I am confused as to where exactly to put it.

I think this is the code I need to use. Please correct me if I am wrong.

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

Re: [WEVOLUTIONS] Listings in 2 columns

By Dave - November 10, 2008

Hi wevolutions.

The first step is to create a plain html mockup of how you want your 2 column layout to look. Usually this is done with a 2 column table. If that's the case then the code would typically look something like this:

<table border="1">
<tr>

<?php foreach ($records as $record): ?>

<td> ... display record here ... </td>

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

</tr>
</table>

Hope that helps!
Dave Edis - Senior Developer
interactivetools.com

Re: [WEVOLUTIONS] Listings in 2 columns

By Dave - November 11, 2008

Hi wevolutions,

Do you want just the image on the left and the content on the right? Or two columns of that?

You could pretty much just put your foreach around that whole table.

What I recommend is starting with a much simpler table layout with borders on and just one field. Then building up from there.
Dave Edis - Senior Developer
interactivetools.com

Re: [Dave] Listings in 2 columns

By Christopherb - March 21, 2009

Hi Dave,

I tried altering that code for displaying thumbnail images in 2 columns per row with no luck.

How would I change the following code to generate 2 columns per row?

<!-- Upload Fields: num, createdTime, tableName, fieldName, recordNum, preSaveTempId, filePath, filename, extension, thumbFilePath, isImage, hasThumbnail, urlPath, width, height, thumbUrlPath, thumbWidth, thumbHeight, info1, info2, info3, info4, info5 -->
<?php foreach ($training_centerRecord['photo'] as $upload): ?>
<?php if ($upload['hasThumbnail']): ?>
<img src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight'] ?>" alt="" /><br/> <?php elseif ($upload['isImage']): ?>
<img src="<?php echo $upload['urlPath'] ?>" width="<?php echo $upload['width'] ?>" height="<?php echo $upload['height'] ?>" alt="" /><br/>

<?php else: ?>
<a href="<?php echo $upload['urlPath'] ?>">Download <?php echo $upload['filename'] ?></a><br/>

<?php endif ?>
<?php endforeach ?>


Thanks,



Chris

Re: [Christopherb] Listings in 2 columns

By Christopherb - March 23, 2009 - edited: March 23, 2009

It was late, I missed an endif...

If anyone needs the code example for a 3 column image display layout with links created for larger images and downloads, here it is...

<table border="1"> <tr> <?php foreach ($training_centerRecord['photo'] as $upload): ?>
<?php if ($upload['hasThumbnail']): ?>
<td>
<a href="<?php echo $upload['urlPath'] ?>"> <img src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight'] ?>" alt="" /> </a>
</td>
<?php $maxCols=3; if (@++$count % $maxCols == 0): ?></tr><tr><?php endif; ?>
<?php elseif ($upload['isImage']): ?>
<td colspan="2">
<img src="<?php echo $upload['urlPath'] ?>" width="<?php echo $upload['width'] ?>" height="<?php echo $upload['height'] ?>" alt="" /><br/>

<?php else: ?>
<td colspan="2"> <a href="<?php echo $upload['urlPath'] ?>">Download <?php echo $upload['filename'] ?></a><br/>
</td>
<?php endif ?>
<?php endforeach ?> <td>&nbsp;</td>
</tr>
</table>

Re: [Christopherb] Listings in 2 columns

By Dave - March 23, 2009

Chris,

Glad you got it working! Thanks for posting back. :)
Dave Edis - Senior Developer
interactivetools.com