How to make a photo gallery with thumbnails in Drupal

Here we will create a simple photo gallery for Drupal CMS that will have thumbnails listed in a table with 3 columns. First of all, please have a look at how our final result will look like:

http://www.iwant2visit.net/gallery/amsterdam-photos

Would you like to have something like that on your website? Read on…

The way I made this photo gallery is kind of a hack, or workaround. It might not be the right way of doing it, but IT WORKS, which is the most important thing.

1. Enable following modules: Image, CCK, Views, CCK Nodereference, Path, Pathauto

2. Go to Image settings in admin section and set the options just like on the following picture and save configuration:

3. Create a new content type “Album” with just “title” field enabled. We will just need to enter title for our albums.

4. Go to Pathauto setup and set following options:

For “Pattern for all Album paths:” put “gallery/[title]”

For “Pattern for all Image paths:” put “gallery/[title]”

Save configuration.

5. Create a new view and name it “album_list”, check “Provide Page View”. For URL you can put anything you want. For view type select “Table view”

• In fields section, add field “Node: title”
• In filters section add filter “Node: type” and select operator “is one of “ and for value select “Album”.
• Add filter “Node: published”, for operator select “Equals”, for value select “Yes”
• Click Save. Now we have our view that we will make a reference to.
• Go to admin -> content types -> Image
• Click “Add field” tab
• Give it a name “album”, and for Node reference select “Select List”
• On the next screen, for label put “Album”, check “Required”
• Click on link “Advanced - Nodes that can be referenced (View)”, and for View select “album_list” from dropdown list.
• Save field settings

6. Now, go on and create a new album”… Create content -> Album. Name it whatever you want, for example “My photos”.

7. Extract the archive attached to this article. There are 2 files “node-album.tpl.php” and “node-image.tpl.php”. Make sure you upload them to your themes/your_theme directory.

8. Now we will add some images to your album. Go to Create content -> Image. Click “Choose” to choose your image. For Album, select the name of your photo album that you have already created ("My photos" or whatever).

9. When you create your image, it will take you to something like
http://www.iwant2visit.net/gallery/amsterdam-1 . The last part of URL is the name of your image.

10. Keep on adding images to your photo album. Don’t forget, every time you upload an image you have to select name of the album that a new image will belong to.

Now you can have as many photo albums as you want and as many images as you want.

You can also experiement and make those pathauto settings to suit your own needs.