[Plugin: jQuery Colorbox] Colorbox and Nextgen pagination

Should have said – Perhaps there is a way of fixing this by adding a class and the code to pull in the album number to the link tag for each thumbnail.

That would be a feature that I am also looking for. If you have a solution pls let me know!

Thanks
Mattki

Hi,
I wrote a feature request for the NextGEN gallery plugin, unfortunately, the author didn’t have the time to implement it yet.

Maybe the workaround I mentioned here works for you?

Cheers,
Arne

Hi Arne,

The problem you are referring to is different but solved for me (I created a template based on the ngg-view defined in gallery.php by adding class=”colorbox-<?php echo $gallery->ID ?>” to the foreach-loop.

The point of klarmer and me is the behaviour of jquery colorbox to display only nggallery pictures that are shown in the post but not the pictures of the same gallery that are shown in a subpage (when the maximum number of pictures in a post or page is set in nggallery).

My workaround for this is to create again a template and to add in the foreach loop for the second and following pictures style=”display:none”. So all pictures of the gallery are loaded, but only the first is shown in the post. But colorbox is displaying all pictures – including the hidden ones.

Again the solution seems to be with ngg and not colorbox.

BR
Mattki

Hi Mattki –
Thanks for posting your fix. Did you make the template for nextgen gallery plugin or colorbox plugin?

Thanks!
K

Hi Klarmer,

so the workaround is managed with nextgen gallery:
In your own theme create a directory called nggallery (i.e. /wp-content/themes/your_theme/nggallery). Copy gallery.php from /wp-content/plugins/nextgen-gallery/view to the new created directory and rename it to gallery-hidden.php. Go to the foreach loop in line 38 of that file and replace it with:
<?php $visible = “” ?>
<?php foreach ( $images as $image ) : ?>

<div id=”ngg-image-<?php echo $image->pid ?>” class=”ngg-gallery-thumbnail-box” style=”display: <?php echo $visible ?>;”>
<div class=”ngg-gallery-thumbnail” >
imageURL ?>” title=”<?php echo $image->description ?>” <?php echo $image->thumbcode ?> >
<?php if ( !$image->hidden ) { ?>
<img title=”<?php echo $image->alttext ?>” alt=”<?php echo $image->alttext ?>” src=”<?php echo $image->thumbnailURL ?>” <?php echo $image->size ?> class=”colorbox-<?php echo $gallery->ID ?>” />
<?php } ?>

</div>
</div>
<?php $visible = “none” ?>
<?php if ( $image->hidden ) continue; ?>
<?php if ( $gallery->columns > 0 && ++$i % $gallery->columns == 0 ) { ?>
<br style=”clear: both” />
<?php } ?>

<?php endforeach; ?>

When using the shortcode [nggallery id=X template=hidden images=0] naggallery will use your new template, will load all pictures of the gallery but will show only the first one (the rest is hidden). When clicking to the image colorbox will show all images of the gallery including the hidden.

Have fun!
Mattki

Hi Mattki –
Thanks for the quick response and help with the code! I’m afraid my issue is a little different but maybe I can use your code to guide me toward a fix. I’m in the process right now of moving my build to the live site but I’ll post a link later today that maybe illustrates my issue better than my words have done.

Thanks again for your time and kind sharing!

Kay