Displaying only one image

10 posts by 4 authors in: Forums > CMS Builder
Last Post: March 24, 2009   (RSS)

By _kate_ - March 23, 2009

I have come across this problem a few times - I will have a site which has a product or other with multiple photographs in one upload field. On the list page I will want only the first photo displayed, and on the detail page I will want all the images displayed (all with thumbnails).

I usually get around this by adding a different upload field for the main image, however is there a way to do this by using one image upload field and using a code?

At the moment I need it for a real estate website where I want one main image on the list page, then that image and the rest on the list page.

Thanks!

Re: [_kate_] Displaying only one image

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

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 ?>



I don't have an answer just yet on your second question - someone else may have to chime in on that one.

Kenny

Re: [_kate_] Displaying only one image

By Dave - March 23, 2009

>I want to be able to have the first image display in one location larger as the main image, and then the rest as small thumbnails below.

You can display your first image like this:
<?php foreach ($record['gallery_images'] as $upload): ?>
<img src="<?php echo $upload['urlPath'] ?>" width="<?php echo $upload['width'] ?>" height="<?php echo $upload['height'] ?>" alt="" />
<?php break ?>
<?php endforeach ?>


Using break to stop after just one and the fieldnames without "thumb" to show the big image.

And this code with a counter to skip the first image and show thumbnails:

<?php foreach ($record['gallery_images'] as $upload): ?>
<?php if (@++$count == 1) { continue; } ?>
<img src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight'] ?>" alt="" />
<?php endforeach ?>


Hope that helps! Let me know if that works for you.
Dave Edis - Senior Developer
interactivetools.com

Re: [Dave] Displaying only one image

By _kate_ - March 24, 2009

Works perfectly! Thanks both of you :)

Re: [Dave] Displaying only one image

By _kate_ - March 24, 2009

Actually now have another problem, maybe because of the end break from that code.

I used the following to make a page specifying the Residential rentals (know I could of just used a URL to get the results, but want specific headings on each diff page)

<?php foreach ($rentalsRecords as $record): ?>
<?php if ($record['type'] != "Residential") { continue; } ?>


Page displays fine, but its set to display the records in sets of ten, but for some reason it stops at 4 and puts the 5th on a new page...

This is the full code I'm using. Thanks!! :)

<?php foreach ($rentalsRecords as $record): ?>
<?php if ($record['type'] != "Residential") { continue; } ?>
<div id="rental_search">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="190" valign="top">


<?php foreach ($record['photos'] as $upload): ?>
<a href="<?php echo $record['_link'] ?>"><img src="<?php echo $upload['thumbUrlPath'] ?>" class="property" /></a>
<?php break ?>
<?php endforeach ?>

</td>
<td valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top: 10px;">
<tr>
<td valign="top"><h1><span style="font-weight: bold"><?php echo $record['suburb'] ?></span>, <?php echo $record['street_address'] ?></h1></td>
<td align="right" valign="top"><h4><?php echo $record['price'] ?></h4></td>
</tr>
<tr>
<td height="80" colspan="2" valign="top"><br />

<a href="<?php echo $record['_link'] ?>">More &gt;</a></td>
</tr>
<tr>
<td valign="middle"><h4><?php echo $record['bedrooms'] ?><img src="imgs/thumb_bed.jpg" width="38" height="35" align="absmiddle" /> <?php echo $record['bathrooms'] ?><img src="imgs/thumb_bath.jpg" width="38" height="35" align="absmiddle" /> <?php echo $record['parking'] ?><img src="imgs/thumb_car.jpg" width="38" height="35" align="absmiddle" /></h4></td>
<td align="right" valign="bottom"><h5><?php echo $record['type'] ?></h5></td>
</tr>
</table></td>
</tr>
</table>
<br />
</div>


<br/><?php endforeach; ?>

<?php if ($rentalsMetaData['invalidPageNum']): ?>
Results page '<?php echo $rentalsMetaData['page']?>' not found, <a href="<?php echo $rentalsMetaData['firstPageLink'] ?>">start over &gt;&gt;</a>.<br/>
<br/>
<?php elseif (!$rentalsRecords): ?>
No properties were found!<br/><br/>
<?php endif ?>


<br /><br />

Re: [_kate_] Displaying only one image

By ross - March 24, 2009

Hi Kate

What does the code up at the top of your page look like? Even though you wanted it to display 10, I am curious if a perpage = 4 got in there somewhere.

Check for that in your code or perhaps you could post a copy of the whole template for me to take a closer look at.

Thanks!
-----------------------------------------------------------
Cheers,
Ross Fairbairn - Consulting
consulting@interactivetools.com

Hire me! Save time by getting our experts to help with your project.
Template changes, advanced features, full integration, whatever you
need. Whether you need one hour or fifty, get it done fast with
Priority Consulting: http://www.interactivetools.com/consulting/

Re: [ross] Displaying only one image

By _kate_ - March 24, 2009

Hi Ross,
No it definetely says 10.

The code appears to work fine - I created the rentals list page which displays all the rentals and it works fine (keeps 10 to a page).

Then I simply added this -
<?php if ($record['type'] != "Residential") { continue; } ?>

So I could have a separate page for Residential and Commercial and thats where the problem started. The Res page displays 4 on the first page, and the Comm page displays 6??? It's very odd.

I will PM you a link to the live pages so you can see what I mean...

Re: [_kate_] Displaying only one image

By Dave - March 24, 2009

Hi Kate,

It's because you're getting the first 10 records, but only some of them are residential or not.

If you want to get the first ten record that are not residential you'll need to add that to your where:

'where' => ' type != "Residential" ',

Let me know if that makes sense.
Dave Edis - Senior Developer
interactivetools.com

Re: [Dave] Displaying only one image

By _kate_ - March 24, 2009

Ahhhhhhhhh I see :)

Cool thanks! Working perfectly now :)