Page 1 of 1

Showing just the first image of the gallery

Posted: Sat Mar 01, 2014 3:44 pm
by nielsvaes
I was wondering if there's a way to do the following:

Just show the first image of the gallery. Then if a visitor clicks on that image, a lightbox opens where the rest of the images are shown in a thumbnail at the bottom and the visitor can click through them.

Example:
http://www.fishermanholidays.com/en/domaine-de-bouxier

Click on Swim Pictures or Pictures Catches.

Is there any way to do something like this with Admiror Gallery?

I know you can set the Gallery template to galleryView, but I would like this gallery to show up in a popup or a lightbox popup.

Re: Showing just the first image of the gallery

Posted: Mon Mar 03, 2014 11:11 am
by Vasiljevski
Well there is no out-of-the-box way, but you can do this in several ways with slightly changing the index.php of the, for example, classic template.

In classic template, we have this part of code:

Code: Select all

// Loops over the array of images inside target gallery folder, adding wrapper with SPAN tag and write Popup thumbs inside this wrapper
if (!empty($AG->images)) {
    foreach ($AG->images as $imageKey => $imageName) {
        $html.= '<span class="ag_thumb' . $AG->params['template'] . '">';
        $html.= $AG->writePopupThumb($imageName);
        $html.='</span>';
    }
}
As you can see , on template level, you have access to the images that should be shown ($AG->images)
In you case, you could do is:

Code: Select all

$first_image = true;
if (!empty($AG->images)) {
    foreach ($AG->images as $imageKey => $imageName) {
        if($first_image)
        {
              $html.= '<span class="ag_thumb' . $AG->params['template'] . '">';
              $html.= $AG->writePopupThumb($imageName);
              $html.='</span>';
              $first_image=false;
        }
        else
        {
              $html.= '<span class="ag_thumb' . $AG->params['template'] . '" style="display:none;">';
              $html.= $AG->writePopupThumb($imageName);
              $html.='</span>';
              $first_image=false;
        }
    }
}
This is just a dirty example, just to explain the idea what is possible.
Hope this helps.