jQuery Lightbox Windows – WordPress Gallery Plugins

by Robb Sutton

WordPress 2.8 update at bottom of article.

Over the weekend, I decided to make a change on Mountain Biking by 198 that would create a better overall user experience at the sacrifice of a little stat love.

Over the course of your blogging, you need to remember that the reader is your first priority. By creating an engaging user experience, you are increasing the likelihood of a return visit, subscription opt-in and word of mouth viral marketing increase. Sometimes, you need to forget your stats that you check far too often and really focus on how you can make your site better for your readers.

Image Galleries in WordPress

With the introduction of native galleries in WordPress 2.5 and higher, it has never been easier to include and manage multiple images within a post. With the introduction of the newest version of WordPress (2.8 and higher), you will be able to insert multiple, different gallaries within the same article, and this is a feature that I have been watching closely. Many of you already know how much of a cheerleader I am for including more images in your blog posts. Not only are they great for traffic when formatted correctly (images searches), but they add a huge positive aspect to your site for those readers that are visual learners like myself. When you start reviewing tangible product, images play a vital role in showing your readers features and details that they wouldn’t be able to see without actually having the product in hand.

Once you start adding a lot of photos to a single post, navigating through each individual image can start to get cumbersome for the reader.

jQuery Lightbox

In an attempt to make image navigation easier for your readers, a jQuery Lightbox provides simple navigation through images in a professional looking package. In simple terms, a jQuery Lightbox loads your images on a window that overlays the article page. As the image loads, the background is darkened and the reader is provided a separate overlay window that allows image viewing and scroll through navigation. This makes viewing large galleries much easier.

To see the jQuery Lightbox in action, go to this post on Mountain Biking by 198 and click on an image in the gallery at the bottom of the article:

Shimano Dura Ace Di2 – Electronic Shifting Review | Mountain Biking by 198

As you can see, it makes viewing multiple images a lot easier by not having to hit the back button multiple times to view different images in the gallery.

jQuery Lightbox’s are used for multiple reasons on many different sites. The use of Lightbox’s for images is probably the most common, but you will also see them used for opt-in forms, contact forms, url previews and anything else that the webmaster does not want you to leave a specific page to view an outside source.

Implementing jQuery Lightbox Galleries Into WordPress

Just like most things related to WordPress, someone else has already done the work for you and provided free plugins that make integrating jQuery Lightbox galleries into your WordPress blog easier than tying your shoes in the morning. For this to work correctly on your WordPress blog, there are two plugins that you need to download and install.

jQuery Lightbox – Activates jQuery Lightbox’s on your WordPress blog.

jQuery Lightbox for Native Galleries – Adds the jQuery Lightbox functionality to your existing WordPress galleries.

Once you have each of those plugins activated and installed, go to a post on your blog and click on an image in a gallery. You should see a window pop up over your post that allows you to scroll through the entire gallery.

What are you losing on blog stats?

I mentioned earlier in this post that implementing this into your blog is going to go against some of your stat love, but what exactly did I mean by that? WordPress, in its current configuration, counts each image view (without the jQuery Lightbox) as a separate pageview because it loads a new attachment page every time one of your readers clicks on an image. By installing the jQuery Lightbox plugins, you are losing that pageview rendering in your stats.

Like I said before, you are creating and managing the content in your blog for the reader…not for statistic counters, so implementing this into your blog is really a no brainer as you want to make your content and multimedia more accessible.

jQuery features can add a lot of interaction and functionality to your blog. As I implement more of this coding into my WordPress blogs, I will show you how you can do the exact same thing to get a more professional looking blog that engages your readers. Hint: Take a look at the featured box on the homepage of robbsutton.com…there is more to come!

Changes in WordPress 2.8

It appears that the new jQuery package in WordPress 2.8 makes it so that you only need one of these plug-ins activated to work. If you are running WordPress 2.8, download and install the jQuery Lightbox for Native Galleries and activate. You should be good to go!


Related Posts


Chris June 1, 2009 - 7:25 pm

Robb! …fantastic tip! It looks great on your homepage too. I’ll have to give it a try on my site. Did it take long to implement?

Robb Sutton June 1, 2009 - 7:27 pm

Thanks Chris! Actually it is pretty easy…but there is a couple of little tweaks for the scroller on the front page if you are using Thesis. I’ll try to get a tutorial up soon.

Robb Sutton June 11, 2009 - 8:42 am

Comment added to top of post…will update as changes take place and a fix is found.

Robb Sutton June 11, 2009 - 10:47 am

Updated with WordPress 2.8 notes.

Chris June 11, 2009 - 11:19 am

Thanks Robb, appreciate the update!


Leave a Comment