Open MIGX gallery from single thumbnail

61 Posts

formulax Reply #1, 8 years, 10 months ago

I just started using MIGX and can't figure this one out. I was able to create a slider on my homepage without an issue as it is just a simple list of image with links around them. I now need to be able to add a gallery to a content page that is launched by clicking a single thumbnail. The other images will load into fancybox.

Here is the markup I need to replicate:

<div class="gallery">
<img src="/images/galleryThumb.jpg" alt="View Photo Gallery" />
<a href="images/gallery1.jpg" class="fancy" title="First Photo" rel="gal"><img src="/images/viewGal.png" alt="View Photo Gallery" id="galOpen" /></a>
<a href="images/gallery2.jpg" class="fancy" title="Second Photo" rel="gal"></a>
<a href="images/gallery2.jpg" class="fancy" title="Third Photo" rel="gal"></a>
</div> 

galleryThumb will be the first thumbnail in the list of migx images.
#galOpen is a image that overlays the thumbnail that has a graphic saying "click to view photo gallery". This will be what actually launches the gallery.

The rest of them will not actually output an <img> tag because we do not want them to load visually on the page, we just need the link to point to the image src and title so fancybox can open them.

Let me know if I need to help clarify that at all.

Thanks!
Steve

This question has been answered by multiple community members. See the first response.

5,888 Posts

Bruno17 Reply #2, 8 years, 10 months ago

is galleryThumb.jpg the first MIGX-item or is gallery1.jpg the first one?

-------------------------------

you can buy me a beer, if you like MIGX

http://webcmsolutions.de/migx.html

Thanks!

discuss.answer

61 Posts

formulax Reply #3, 8 years, 10 months ago

Hi Bruno, good question. Originally galleryThumb was going to be a separate file that was sized down as a thumb, but I think I can just use phpthumbof so the thumb is actually just the first image in the list.

discuss.answer

5,888 Posts

Bruno17 Reply #4, 8 years, 10 months ago

I think, it should look something like that:

[[getImageList?
&tvname=`yourmigxtv`
&wrapperTpl=`galleryWrapper`
&tpl_1=`galleryTpl_1`
&tpl=`galleryTpl`
]]

galleryWrapper:

<div class="gallery">
[[+output]]
</div> <!-- gallery -->

galleryTpl_1:

<img src="[[+image:phpthumbof=`w=150`]]" alt="View Photo Gallery" />
<a href="[[+image]]" class="fancy" title="[[+title]]" rel="gal"><img src="/images/viewGal.png" alt="View Photo Gallery" id="galOpen" /></a>

galleryTpl:

<a href="[[+image]]" class="fancy" title="[[+title]]" rel="gal"></a>

-------------------------------

you can buy me a beer, if you like MIGX

http://webcmsolutions.de/migx.html

Thanks!

61 Posts

formulax Reply #5, 8 years, 10 months ago

Thanks Bruno! Seems to be working perfectly. I did not realize you could do multiple templates like that.

Answered Open MIGX gallery from single thumbnail