Galleries have always been an interesting subject in the world of Drupal. Many people have their own ideas of what makes a gallery as well as how it is supposed to work. In order to be successful with online galleries, you must have control of what you are doing.

Many people like the pop-up galleries which generally use jQuery plugins that are constantly evolving. Lightbox changed to Lightbox2, then Thickbox, and Colorbox now. The pop-up plugin that I have grown to love is the Shadowbox plugin. I think with what I am used to working with in terms of images and drupal, Shadowbox seems to be the most flexible fit. You can read more about the pop-up gallery problem on my Web Easy Media blog post.

Here are some of my approaches to better controling my pop-up galleries in Drupal using Shadowbox. These techniques are assuming that you already have your modules installed and are only attempting to have better control of what is there.

It seems the standard application of a pop-up in Views is to say "I want this sized photo to link to that sized photo" and that is about it. Many cases, they will take the title of the node for the caption of the photo.

With Shadowbox in Drupal 7, you have a few more options. You can select what will be grouped into a gallery. For example, you can select a gallery field if you want only the single field to be grouped into a gallery. This would only make sense if you had an image field that was set to more than 1 input.

You can also select if you want the node to be where your photos are grouped. This would makes sense if you had multiple photo fields. And the last option is to group the images on the page. This would group all the shadowbox images on the page into one gallery.

The title option allows you to select which image attribute you would like to be displayed as the pop-up title. You can select between the node title, the image title field, or the image alternate text field. The last two options are only available if you have those options selected in the field settings of your image field.

So what if these options aren't enough? One of the main differences between different types of pop-up galleries is the way you call the gallery. Some require specific classes, others require additional lines of jQuery to get the control that you want. For Shadowbox, it uses the relationship attribute (rel) to specify the relationship of the link to the pop-up.

In this relationship attribute, you can control the gallery into which the pop-up is grouped as well as the height and/or width of the pop-up window. The height and width are mainly used when you are calling HTML content into the shadowbox. For instance, it is often handy to have a webform pop up into a shadowbox. To do this you would use a relationship attribute like this:

<a rel="shadowbox;height=200;width=300" href="mydomain.com/contactform.html">Contact Us</a>

To group multiple images into a gallery, you would give all of the images an attribute like this (the title attribute gives the gallery caption or title):

<a title="Gallery Title" rel="shadowbox[galleryname]" href="mydomain.com/big-image.jpg">Small Image</a>

This second example is what you will want to use in your view. I have often used Node References to associate images to a gallery content type. You can read more about this style of creating photo galleries here.  But unless you have your shadowbox set to display all images on a page into a gallery, this will not be an ideal display.  The user will have to click on an image, and then close it before viewing the next one. OR if you have a different gallery being displayed in a sidebar, those photos will appear in this gallery as well.

So to make your gallery output in a way that your users understand, you need a little more control. To control your shadowbox gallery with a view display in Drupal, you want to create a view with the following fields:

• Original Image URL
• Thumbnail Image
• Image Node Title
• Gallery Name (node reference)
• NID (node id)

Now the first thing you might be thinking when you see this is "Where the heck is the Original Image URL??" This was a standard part of the Drupal 6 Views and Imagefield formatters, but in Drupal 7, it seems to have disappeared. On the very day that I was researching this, I found a new module that was released less than an hour before (talk about timing!). This module solves that very problem - it's called the Image URL Formatter.

You will exclude the URL, Thumbnail, and Gallery name from your view. Then in the NID field, select "Rewrite Output of This Field". Then you can use the Replacement Tokens, which are listed below the rewrite field, to create your ideal shadowbox relationships. (The following field tokens are made up, just to show you how it works. Your tokens will vary based on your field machine names.)

<a rel="shadowbox[[field_gallery_name]]" title="[node_title]" href="[field_image_url]">[field_image_thumbnail]</a>

This will allow all of the images within each gallery to be grouped independently of other images on your page. This will also give the caption, or the popup title, the same title as each of your photos.