Display NextGEN Gallery Images In A Slider
HL News • February 15, 2014
Using WordPress, I recently ran across an opportunity where I needed to recreate the look and feel of a clients sliding image gallery. I also needed to make it responsive for mobile devices, tablets, etc., and easy for the client to upload images into categories.
I decided to use the NextGEN gallery plugin to organize the clients images and created unique galleries for each type of category.
Because the slider needed to be responsive, there weren’t any plug-and-play image slider NextGEN compatible plugins that would accomplish everything that I needed. So after a little research, I ran across the nifty jQuery script from FOTORAMA, which is not only extremely light-weight, but is responsive and works with all types of data; images, video, HTML, etc.
For this example I will show you how to use FOTORAMA and NextGEN to create a super simple slider (but really you can easily modify this to work with another image slider).
The first step that I did was to add the FOTORAMA code to the template that I was using and all of the parameters that I needed for the slider:
The next step that I did was to call the images from the NextGEN gallery below the DIV tag:
$gallery = $nggdb->get_gallery(3, 'sortorder', 'ASC', true, 0, 0);
foreach($gallery as $image) {
echo '
';
} ?>
Note in the second line of the above example, my category is ‘3’ – change this number to your category ID number.
That’s it! This is a super simple way to make an image slider in WordPress using the NextGEN gallery plugin.
