Images & Galleries in Drupal 6

Update 24-Dec-2009: My new post on Image Galleries in Drupal 6.15 is here.

Drupal is a very powerful and flexible framework for web site and applications. You can do some really amazing things very easily. However sometimes the opposite is also true – simple thing can be seemingly impossible or annoyingly complex. Like many people I like to post personal pictures of vacations or other stuff to my web sites. Drupal’s capabilities for easily publishing a set of pictures, having them auto-scaled, and then visible in a gallery seem to be crude.

What’s up with this? I’ll examine some of the tools available for Drupal 6 and give some examples for exactly how to make a couple of the these work. Maybe in the end we’ll see things aren’t so bad afterall.

Plone – another CMS I use frequently – has a really nice and easy interface for creating galleries that are powered by various JavaScript wrappers like Lightbox or Simple Gallery. You can grab a gallery product, install it, copy a zip file of pictures up to a Plone site, they will get auto-extracted into a “folder” in your plone CMS, and then they will get scaled and thumb nailed for you. The scaling is all driven by the Python Imaging Library, a powerful set of graphics manipulation tools that is similar to PHP’s gd library.

With Drupal there is nothing nearly as easy, although with a bit of work you can get close. The most promising tool that I can find is Brilliant Gallery – however it is not yet ported to Drupal 6 and it does not seem like there is any work on a port. I found a few other modules that look to have the features I want:

• Slideshow Creator
• Lightbox2
• Image

Before getting started with these modules, a bit of level setting is a good idea. I’m running Drupal 6.2 with a very up to date config. I’m running with the latest rev of PHP for Win32 and also the latest MySQL for Win32. I’m expecting you to be pretty familiar with Drupal and how to install and enable modules.

The first thing to do is setup FCKEditor with the IMCE mdoule for file upload handling. I highly recommend doing this and will assume that you have – FCK includes a decent set of instructions for itself. IMCE is a decent file browser and upload manager and sets things up for individual use too. The included instructions are pretty straightforward.

Once you have done this make sure you have the gd library enabled in the image toolkit section of the administration interface. Now you should be able to go to your user’s page and see an extra tab called “file browser”. This is supplied via IMCE and you can use this to upload all kinds of files, including images. Images have extra support for resizing and thumbnailing. From what I can tell you must add pictures one at a time. That’s a problem for people like me that tend to take pictures until their 5 GB SD card is full 🙂 Another quirk is that if you try to upload a pic that is larger than the max file size you are allowed to upload, IMCE will still try to do it , but not give you an error when it fails.

Of course there is a backdoor to uploading files. If you have access you can manually copy files under the directory tree that IMCE is using to manage files. On my machine this is /sites/default/files. With IMC installed with FCK too now you can have a single directory structure for managing your images in one spot.

Now onto the modules!

Galleries in Drupal 6: Slideshow Creator

This module has the makings of a decent gallery tool. There’s (at the time of writing) a development version for D6. I found that it installed easily, but check the dependencies and get all the JavaScript stuff installed. Once you have it installed you need to go and add a new filter type for the markup that is used to create galleries. The instructions in the readme are accurate.

After getting that done and loading up a few pics as described you can display galleries. In the module properties there is a setting for the resolution of the images. They must match this resolution exactly so be sure to either use the IMCE tools to scale them – or use a nice tool like Faststone Photo Resizer. FPR is cool and I prefer it to IMCE because I have much more control over what’s going on.

With Slideshow Creator you can create discrete galleries of specific images or you can tell it to bring up all pics in a directory. The former is documented well in the readme, but the latter is not so here’s an example of the latter:

[slideshow: 2, rotate=2, blend=1 height=400, width=400, dir=|sites/default/files/pictures/|yes||Generic Photos|Arent they great?||]

That seems to work ok. There are a couple of options that you can fiddle with to control how the gallery behaves and looks, including some settings for the “auto” mode on changing the image. There’s a CSS that you can use to customize the look a bit more.

Overall – not a bad tool except for the manual work of image sizing and the crude control over how the gallery appears on the page.

Galleries in Drupal 6: Lightbox 2

Lightbox2 is a pretty nice module. The installation is straighforward and well documented. Additional documentation is available too. Once installed and enabled properly you just need to add a few images (using the method above with IMCE or just cpoying a few to a url your drupal site can see) and then you need to add links to them following the instructions in the readme.txt. There are options for single images and for slideshows. Unfortunately there is no option to add all images in a directory to a slideshow. This options would make this tool a killer.

When you have your images in a gallery they are nice rollovers to go the previous or next image, you can zoom an image, include captions, etc. Very nice! Performance is good too. Because the images are loaded up in the Lightbox they will not mess up your Drupal theme either.

So far the only downside is the requirement to many create all the hyperlinks for the images in your gallery. There is an option to hide the links so that you can have one linked image with multiple pictures. I found that very useful. What I do is create the image and link where I want it on the page and then include all the other grouped image links with the hidden option down at the bottom of the page so that it does not mess up my content with blank space. That works pretty well – it also makes it much easier to just cut/paste the link and change the image. If you use FPR to resize your images and use the autonumber function then creating the links is much easier.

Galleries in Drupal 6: Image

The Image module provides a number of pieces of functionality that allow you to handle uploading, scaling, and managing images as well as creating galleries. There’s a lot of good documentation on the module as well, although its not clear if it has been updated for D6. The installation instructions work well. You’ll need to go in an adjust a few things – your path to the image upload and processing directory and by default the image module restricts you to a measly 800KB pic. I gave that a x10 so that my 12 mpel pics get uploaded with no issues.

Once you get all the modules enabled you need to add a gallery – then you can add images individually under the content management menu or in groups using the image import menu in the administer content menu. I noticed that when I added a bunch of images it did take a while to get them all scaled and thumbnailed, but it did work! That’s really nice. What’s even better is when I go to look at the gallery the Lightbox2 stuff works and will show the images in the Lightbox perfectly! Well that is very cool indeed!

There’s a few nice blocks for images to put in your sidebars, but strangely no gallery block. I guess you can probably add your galleries as primary/secondary links or something.

I’ve hit a couple of issues with this module. the galleries are nice and it seems possible to spruce them up a bit, but I have not found a decent way to integrate them into my posts without just creating a hyperlink out. A hyperlink out is ok, but it means a user has to then click on a link to start the slideshow. I’d like to have the first image load up directly. The second issue I’ve seen is that the thumbnails and derivatives don’t always get created on the first import, but will get created when the gallery first loads up. This causes a really slow page load the first time. After that then all is well. I think with really large galleries of 100 pics then you’ll have some issues with memory and timeouts, but as long as it is only during the first load then that’s ok for me.

Galleries in Drupal 6 – What’s the deal?

I’m pretty happy with Lightbox2. I think I’ll use this for most of my galleries. Image is nice, but until I can figure out how to get the galleries better integrated with my posts I think I will only use this for large galleries of pics (50-100 pics)  that I want to get quickly up on my site. Image seems to be the most complete gallery tool for Drupal and using it with Lightbox2 really does create a very powerful and easy to use set of tools that puts Drupal on a par with the best that you can get for other tools like Plone.

If I fugre out how to get smoother integration of Image galleries in my posts, I’ll put an update here.