Blog (view all)

Aaron Dudenhofer's picture

Control Your Galleries

A recipe for better pop-up gallery control

This recipe is created to help you better control your gallery displays. The topic of galleries have always been an interesting subject in the Drupal world. There are always many factors about what a gallery actually is as well as how you should make one for your site. Because Drupal is so flexible, there are obviously many solutions.

This solution that I am going to propose is based on my own experiments with various galleries. This set up will give you a lot of flexibility as well as a lot of control.

You may have read Jeff Eaton's blog post about creating galleries with Views Attach (EVA for Drupal 7). I still think that this is an excellent way to create your galleries. It allows you the customization of your image fields (like title, caption, description - whatever you want) by giving them their own content type. It also allows you extra control of how those images are displayed since you are using views to display them.

One of the problems with this comes when you begin to create more complex galleries. I like to put different gallery displays on one page. If some one is browsing gallery topics, they should see a few pictures from the gallery (which the views attach approach does), and they should be able to click on the image to see it full-sized (which a lightbox, thickbox, colorbox, or shadowbox does). The problem is when that image is popped up, they should only scroll between the images within that gallery.

The answer to this is to re-write the output of your view. Personally I go with Shadowbox as my pop-up gallery of choice simply because of the ease-of-use to control this when you re-write your view output. You do this by building your view as you normally would. You need fields for the Original Image URL, Gallery Name, Image Title, and the Image Thumbnail. This can be accomplished by adding at least 2 of the same image fields, only with one outputting the URL, and the other outputting the thumbnail. Then you 'exclude' all of these fields from your view. Then create a new field (this can be an NID field that you select "Rewrite the Output"), where you will put it all together.

The ultimate goal of rewriting your view is to follow this recipe:

<a title="[Gallery or Image Title]" href="[Original Image URL]" rel="shadowbox[[Gallery Name]]">[Image Thumbnail]</a>

Adjusting these fields in your view output gives you the control to display multiple galleries on one page, but still keep the scrolling or paging between them restricted to the selected gallery. You can read more about using Shadowbox and Drupal 7 for this level of control on my blog post.