Creating A Flexible Drupal Image Gallery
This approach to a Drupal photo gallery is a bit different from other approaches I’ve seen in that it allows users to upload multiple photos to a single node which then can become a slideshow or image gallery.
It uses the following components and modules:
Just create a content type called “Photo Gallery” and add a imagefield to the content type. Allow unlimited uploads of this field. At this point, I recomment setting the path to these images to be something other than your default files folder. You can specify the path in the content type setting. You can enable the title and alt fields if desired for each image.
Next, in your url / automatied alias settings, set the default path for photo nodes to be “photo-gallery/[title-raw]”. We’ll use this later.
Next, you can create “extended” fields for the imagefield uploads. You create these optional fields using ImageField extended. You could add a “location” text box or maybe a longer description or URL field if needed. This step is optional.
Next, create an imagecache preset called photo_thumb for the gallery called photo_thumb. The thumb should be square, maybe 200×200 pixels with a scale/crop preset.
The final step is to create a view using the “grid” style plugin which is now standard in views 2. Create a “page” display that is styled as a grid. Use fields for your imagefield. Set the imagefield to show your thumbnail and use the lightbox when clicked, something like “photo_thumb -> lightbox2”. Make sure you turn off grouping for this field. Add an argument to your view for “nid” and set filters to restrict to published nodes of type “photo”. Set the path for this view to be “photo-gallery/%”.
Next, in the same view, create a block that has the same settings as above, but don’t add the nid argument, and use the “node title” field instead of the imagefield. This will give you a list of all “photo” nodes.
Next, create a panel page variant that overrides the default style for nodes of type “Photo Gallery.” Add the block we created to a left panel region, and the grid view as the main body.
So, now you can create “photo gallery” nodes. When you view one of these nodes, the panel will override the display and show your block navigation on the left and a grid of thumbnails on the right. When you click a thumbnail, the image will popup with the lightbox2 effect!