Jump to content

Lightbox gallery launched from single thumbnail?


photoman355
 Share

Recommended Posts

I've been putting together a simple lightbox gallery using prettyPhoto.  I have this working but I only want one thumbnail to launch the gallery and at the moment I'm getting one thumbnail for each image.  Apologies for my poor php skills, I know this is coming from the echo but don't know how to display <img> only for the first list item.

Here's my code:

<ul id="gallery1">
    <?php 
        foreach($page->images as $img) {
	$thumb = $page->thumbnail->size(220, 200); 
        echo "<li><a href='{$img->url}' rel='prettyPhoto[gallery1]'><img src='{$thumb->url}' alt='{$thumb->description}' width='{$thumb->width}' height='{$thumb->height}' /></a></li>";
    }?>
</ul>

And my original code:

<ul id="gallery1">
    <li><a href="assets/library/image01.jpg" rel="prettyPhoto[gallery1]"><img src="assets/library/thumb1.jpg"/></a></li>
    <li><a href="assets/library/image02.jpg" rel="prettyPhoto[gallery1]"></a></li>
    <li><a href="assets/library/image03.jpg" rel="prettyPhoto[gallery1]"></a></li>                        
</ul>

Any help would be greatly appreciated.

Link to comment
Share on other sites

<ul id="gallery1">
    <?php
        $thumb = $page->thumbnail->size(220, 200);//outside of the foreach so it only runs once
        foreach($page->images as $img) {
            $thumbImg = $img === $page->images->first() ? "<img src='{$thumb->url}' alt='{$thumb->description}' width='{$thumb->width}' height='{$thumb->height}' />" : ""; //if this is the first image $thumbImg gets the content. If not, it's empty.
            echo "<li><a href='{$img->url}' rel='prettyPhoto[gallery1]'>{$thumbImg}</a></li>";
    }?>
</ul>
 

edit:

The code above will throw an error if you don't have any image uploaded in the thumbnail field. You should also prevent that error by checking for it.

  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...