Connecting thumbnails to images extracted using php

Question

I have a slider (flexslider) that i\'m using to display images in the form shown in the below jsfiddle... I optimized the slider so that it extracts images (which are named

Answer 1

You have to edit your php code, where you generate hmtl for images to the code below:

$slide_images[$filename] = '<a class="fancybox" data-fancybox-group="slide-N">';
$slide_images[$filename] .= "<img src='{$filename}' alt='{$filename}' />";
$slide_images[$filename] .= '</a>';

So you'll get exact markup, needed for fancybox, but you have to set fancybox-data-group attribute to be equal for all images on one slide (replace "slide-N" to your actual "slide-1" etc), when fancybox will show thumbs for images on your current slide. Here is jsfiddle example what you'll get after it.