Skip to: Site menu | Main content

Trying out Lightbox2 with Imagecache and Imagefield in Drupal 6

I have a new client that has hired me to build a small, Drupal-powered web site for his scholarship foundation. Since the site is very straight-forward and not slated to go live for a few weeks, I decided to see if I could build the site using Drupal 6. The big challenge is seeing if I can get all of the image functionality working (and stable) using the bevy of development- and alpha-versions of the necessary modules.

The idea is to be able to add an image field to the standard story and page content types and use ImageCache and Lightbox2 to display the images. As of this writing, the required modules are at various stages of development:

  • CCK: 6.x-2.0-rc6
  • Lightbox2: 6.x-1.8, but only the development version is working with CCK2 at this time.
  • ImageCache: 6.x-1.0-alpha2
  • ImageField: 6.x-3.0-alpha2
  • ImageAPI: 6.x-1.0-alpha2
  • FileField: 6.x-3.0-alpha4

Installation of the modules wasn't as smooth as I hoped, after moving the modules into the sites/all/modules directory, I decided to tempt fate and try to enable all of the relevant modules at once. I immediately got a white screen of death with a error message indicating that the "content_notify" function was not defined. I went back and enabled CCK first, then FileField and ImageAPI, then ImageField, then the rest. It appears that one of the modules I was trying to install tried to call the "content_notify" function from CCK before it was loaded (based on a cursory search of the code, both FileField and ImageField call the "content_notify" function from the install files).

Regardless, once I had all of the modules installed, I set up my configuration as follows:

  1. I created two imagecache presets: "thumbnail" and "large".
  2. I added an imagefield to the "story" content type. For the most part, I used all default values in the imagefield's configuration other than enabling custom title text, allowing for unlimited images per story, and disabling the description field.
  3. I set the teaser and full node display options on "display" tab of the edit "story" content type (admin/content/node-type/story/display) to use Lightbox2. In my case, I used "Lightbox2: thumbnail->500_pixels_tall". This will initially display the thumbnail of the image on the page and when the image is clicked, the Lightbox effect will be used to display the larger image.

Once the configuration was done, I went ahead and added some new "story" nodes with various photos and everything worked great - I haven't seen a single issue yet. Despite the fact that this is simple application of these modules, I'm quite pleased that these 6 modules - with 3 different maintainers (and a whole bunch of contributors) are working so smoothly despite the fact that 4 of the modules are alpha-level code and one is a development version. Thanks and great work!

Submitted by michael on Thu, 09/04/2008 - 10:31am
Filed under:

Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.

Grateful - your article is really easy to follow ...

... but I'm struggling with a related problem. It's probably something really trivial but I can't see it ...

I have Lightbox2 working with my stories, but any pictures I upload appear clustered together at the bottom. I need to get the same Lightbox effect, but with my thumbnail pics set through the story text - as they would be if you inserted an image using TinyMCE.

Hope that makes sense - anybody know what I'm missing/doing wrong.

rel="lightbox"

Bob,

You'll need to manually place the images where they need to be (using a WYSIWYG editor) and then add


rel="lightbox"

To an "

Thanks for sharing these info

Thanks for sharing these info with us!
I will keep in touch with your blog reading...
anabolic steroidsbuy testosterone

Thanks - you helped this beginner greatly

Your very short tutorial was enough for this very novice drupal user to get going with lightbox.

Only thing I would mention is the importance of modifying permissions after each module is enabled. I'm sure that's something most people learn quickly after working with drupal, thouogh!

As easy as possible

Thanks for this really simply description how to make Lightbox2 work with Drupal 6. I'm using views for full gallery view and it's also a piece of cake...

great

Super great post!
I have been fiddling around with the 6.x version (non-devel) for 5 hours wihout any result - now just updated lightbox 2 -> devel-version - everything worked first run - you saved me a great deal of pain!

/Moefelt

Help :)

Hi Michael,

I have been trying to do the exact same thing with no luck. There is just not much help out there for Drupal 6 yet.

Your post seems like exactly what I need. I am fairly new to drupal so I wondered if you might be able to give me a quick walk through in a bit more detail about the steps you too to make this work?

Thanks,
Steph

Thanks - this was very helpful

Mike,

Thanks for this review of these great modules.

What I want to do is.... I want a slideshow that only displays the first image in the teaser and full node views. Then use Lightbox 2 functionality to view all of the images...

I see that Image field provides a "list" checkbox - in my 3 image test I only have the first image checked -- I would expect the next two to not show (I have upload module also enabled - is "list" maybe coming from that?)