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: [Dave] Listings in 2 columns

By wevolutions - November 10, 2008

Here is the html mock up code. I have a few table cells with images and information in other cells so I am not sure where to insert the code for it to work.

<table width="544" border="0" cellspacing="0" cellpadding="0">
<tr height="1">
<td colspan="3" valign="top" bgcolor="#d9dadc" width="544" height="1"></td>
</tr>
<tr height="120">
<td valign="top" width="175" height="120"><?php foreach ($record['main_photo'] as $upload): ?><?php if ($upload['hasThumbnail']): ?><a href="<?php echo $record['_link'] ?>#top"><img src="<?php echo $upload['thumbUrlPath'] ?>" width="160" height="120" border="1" alt="" hspace="5" vspace="5" /></a><?php elseif ($upload['isImage']): ?><img src="<?php echo $upload['urlPath'] ?>" width="<?php echo $upload['width'] ?>" height="<?php echo $upload['height'] ?>" alt="" /><?php else: ?><a href="<?php echo $upload['urlPath'] ?>">Download <?php echo $upload['filename'] ?></a><?php endif ?><?php break; ?><?php endforeach ?><br />
</td>
<td valign="top" width="149" height="120"><br />
<font size="4" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular"><b><a href="<?php echo $record['_link'] ?>#top"><?php echo $record['main_id'] ?></a></b></font><font size="3" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular"><b><br />
</b></font><font size="2" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular">
<table width="138" border="0" cellspacing="0" cellpadding="0">
<tr height="20">
<td align="left" valign="top" width="45" height="20"><font size="2" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular">Make:</font></td>
<td align="left" valign="top" width="93" height="20"><font size="2" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular"><b><?php echo $record['make_of_car'] ?></b></font></td>
</tr>
<tr height="20">
<td align="left" valign="top" width="45" height="20"><font size="2" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular">Model:</font></td>
<td align="left" valign="top" width="93" height="20"><font size="2" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular"><b><?php echo $record['model_of_car'] ?></b></font></td>
</tr>
<tr height="20">
<td align="left" valign="top" width="45" height="20"><font size="2" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular">Year:</font></td>
<td align="left" valign="top" width="93" height="20"><font size="2" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular"><b><?php echo $record['year_of_manufacture'] ?></b></font></td>
</tr>
</table>
</font></td>
<td valign="top" width="220" height="120"><br />
<font size="4" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular"><b><?php echo $record['license_plate_no'] ?></b></font><font size="3" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular"><b><br />
</b></font>
<table width="220" border="0" cellspacing="0" cellpadding="0">
<tr height="20">
<td align="left" valign="top" width="86" height="20"><font size="2" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular">Asking Price:</font></td>
<td align="left" valign="top" width="134" height="20"><font size="2" color="red" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular"><b><?php echo $record['asking_price'] ?></b></font></td>
</tr>
<tr height="20">
<td align="left" valign="top" width="86" height="20"><font size="2" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular">Contact No.:</font></td>
<td align="left" valign="top" width="134" height="20"><font size="2" color="black" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular"><b><?php echo $record['contact_phone_nos'] ?></b></font></td>
</tr>
<tr height="20">
<td align="left" valign="top" width="86" height="20"><font size="2" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular"><a href="<?php echo $record['_link'] ?>#top">More Details</a></font></td>
<td align="left" valign="top" width="134" height="20"></td>
</tr>
</table>
</td>
</tr>
<tr height="1">
<td colspan="3" valign="top" bgcolor="#d9dadc" width="544" height="1"></td>
<?php endforeach; ?></tr>
</tr>
</table>

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