Image layout

5 posts by 3 authors in: Forums > CMS Builder
Last Post: April 21, 2010   (RSS)

By KCMedia - April 21, 2010

Hi I am just wondering

I have images that i want to layout like this

One image to be 300 x 300 it will be Thumbnail 3

Then below it i want to have the rest of the images using Tumbnail 2 one after each other side by side

How would i go about that.

All the images will be make to go larger using Lightbox also i can get that work ok but just the layout.

I have attached the php file for this page.
Thanks



Craig

KC Media Solutions

www.kcmedia.biz
Attachments:

custom-motorbikesdetail.php 26K

Re: [kcmedia] Image layout

By Kenny - April 21, 2010

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


You'll need to change the variables to match your setup, but that is the basic idea of how to do it.

Let us know if you need further help on this.

Kenny

Re: [kcmedia] Image layout

By gkornbluth - April 21, 2010

Hi KCMedia,

To use a particular thumbnail you would put a 2, or a 3, etc. after the thumbUrlPath, thumbWidth and thumbHeight.

So you would use thumbUrlPath2, thumbWidth2 and thumbHeight2 to display thumbnail 2

Best,

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] Image layout

By KCMedia - April 21, 2010

Thanks guys that worked perfect looks great now

Craig
Thanks



Craig

KC Media Solutions

www.kcmedia.biz