Gallery Layout

6 posts by 3 authors in: Forums > CMS Builder
Last Post: February 22, 2009   (RSS)

By Ginslinger - February 22, 2009

In the process of building a gallery using cmsb but have layout issues I haven't been able to figure out. What I would like to be able to do is have the list page automatically insert a single image from each gallery record (album) and display on the list page with album information to the right of the image.



Code I am currently using on the list page below


<?php foreach ($photosRecords as $record): ?>
Record Number: <?php echo $record['num'] ?><br/>
Title: <?php echo $record['title'] ?><br/>
Content: <?php echo $record['content'] ?><br/>
Album Name: <?php echo $record['album'] ?><br/>
Date: <?php echo date("D, M jS, Y g:i:s a", strtotime($record['date'])) ?><br/>
<!-- For date formatting codes see: http://www.php.net/date -->
_link : <a href="<?php echo $record['_link'] ?>"><?php echo $record['_link'] ?></a><br/>

<hr/>
<?php endforeach; ?>

<?php if (!$photosRecords): ?>
No records were found!<br/><br/>
<?php endif ?>


I realize I may have to add another field to get the single image to display but I have not been able to figure exactly what to add or the placement of code within a table to make the list page display the way I would like. Detail page is working fine.

Re: [Ginslinger] Gallery Layout

By Kenny - February 22, 2009

If you know all your uploads are images and will have thumbnails you can remove this code:

<?php foreach ($record['gallery_images'] as $upload): ?>
<?php if ($upload['hasThumbnail']): ?>
<img src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight'] ?>" alt="" />
<?php endif ?>
<?php endforeach ?>

Next, if you want to show just one image you can use break like this to stop after just one:

<?php foreach ($record['gallery_images'] as $upload): ?>
<img src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight'] ?>" alt="" />
<?php break ?>
<?php endforeach ?>


And if you want a random image you can shuffle your array first:

<?php shuffle($record['gallery_images']) ?>
<?php foreach ($record['gallery_images'] as $upload): ?>
<img src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight'] ?>" alt="" />
<?php break ?>
<?php endforeach ?>



Kenny

Re: [sagentic] Gallery Layout

By gkornbluth - February 22, 2009 - edited: February 22, 2009

The first step in solving any layout issues is to create an html page that displays the way you want it to. Then replace the variables that you want CMSB to handle with the code from the code generator. Make sure that you choose the list or detail page code depending on your desired result. If you're using tables to display your data insert the appropriate information in the cells and then replace that specific information with the PHP calls.

Here's an example that displays a live image link in one column and a description in the other: (the if statements eliminate blank space if a field is blank)

<table width="90%" border="0" cellpadding="5"><?php foreach ($happeningsRecords as $record): ?>
<tr>
<td align="center">&nbsp;</td>
<td align="left" valign="top"><hr align="left" width="300" color="#99945e"/></td>
</tr>
<tr>
<td align="center">


<?php foreach ($record['image1'] as $upload): ?><a href="<?php echo $record['_link'] ?>"><img src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight'] ?>" alt="" /></a> <div class="body-text-bold">
<?php if ($upload['info1']): ?><?php echo $upload['info1']; ?><?php endif; ?><br />
<?php if ($upload['info2']): ?><?php echo $upload['info2']; ?> <?php endif; ?></div>
<?php endforeach; ?>



</td><td align="left" valign="top"><a href="<?php echo $record['_link'] ?>"><span class="heading-text-bold"><?php echo $record['title'] ?></span> <?php if ($record['short_description']): ?><br /><span class="body-text-bold"><?php echo $record['short_description'] ?></span><?php endif ?><br />
<span class="body-text"><?php echo date("D, M jS, Y g:i", strtotime($record['starting_date'])) ?>
<?php if ($record['ending_date']): ?>
through <?php echo $record['ending_date'] ?></span>
<?php endif; ?>
<br />
</a><?php endforeach; ?> </td>
</tr>
</table>

Hope that helps.

Jerry Kornbluth
The first CMS Builder reference book is now available on-line!

Take advantage of a free 3 month trial subscription, only for CMSB users, at: http://www.thecmsbcookbook.com/trial.php

Re: [gkornbluth] Gallery Layout

By Ginslinger - February 22, 2009 - edited: February 22, 2009

Just a simple table structure like below.

<table>
<tr>
<td>Image</td>
<td>Album Decription</td>
</tr>
</table>

This is on the gallery list page which will display 5 records for each page with links to the detail page (Gallery) As I said the gallery page (Detail) is working fine but I have tried so many different placements of the code but continue to get errors.

The single image could be (or may need to be) another upload field if needed. Gallery is set to max at 25 images. This is the detail page. Issue I am having is the list page for the photo albums within the gallery.

Re: [gkornbluth] Gallery Layout

By Ginslinger - February 22, 2009

Thanks Jerry, I'll give it a try.

BTW: I've often found it helpful to create a separate upload field for my gallery list page images, since they are not always the first image that is chosen for the gallery itself.


That is what I meant by the extra upload field for the list page image.

Help is much appreciated.