While working on a friend’s blog, I ran into a bit of a problem with having multiple Lightbox galleries on a page in WordPress: all images on a page will be in the same gallery despite being from different posts. It would basically mean that clicking on an image from one post’s gallery will allow a reader to navigate to all images on a page.
There was a simple fix, but it was rather manual. It involved taking the gallery shortcode for WordPress:
1 | [gallery] |
And adding a class to separate the galleries:
1 | [gallery class="gallery2"] |
However, this was a manual process and I was sure that there was a way to make it more automated so that I wouldn’t have to add a class for each gallery, perhaps using the post ID as the class name to separate them?
After some digging around, I found this in /wp-content/plugins/lightbox-gallery/lightbox-gallery.php:
507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 | extract(shortcode_atts(array( 'order' => 'ASC', 'orderby' => 'menu_order ID', 'id' => $post->ID, 'itemtag' => 'dl', 'icontag' => 'dt', 'captiontag' => 'dd', 'columns' => $columns, 'size' => $size, 'include' => '', 'exclude' => '', 'lightboxsize' => $lightboxsize, 'meta' => 'false', 'class' => 'gallery1', 'nofollow' => false, 'from' => '', 'num' => '', 'page' => $page, 'before' => '<div class="gallery_pagenavi">' . __('Pages:'), 'after' => '</div>', 'link_before' => '', 'link_after' => '', 'next_or_number' => 'number', 'nextpagelink' => __('Next page'), 'previouspagelink' => __('Previous page'), 'pagelink' => '%', 'pagenavi' => 1 ), $attr)); |
A simple change with the ‘class’ part of the the array do exactly what I need:
520 | 'class' => "'" . $post->ID . "'", |
Ta-da! Multiple Lightbox galleries on a single page are now automatically separated by post ID without any extra manual fuss. Photos in each post will now remain sandboxed inside of each post, regardless of how many are listed on a page.
Enjoy!