Automatically organise your digital photography by taking advantage of your cameras built-in metadata and PHP's EXIF functions.
If you have a digital camera, you probably also have a digital photo gallery of memorable moments. And if you have a digital photo gallery, you're almost sure to have run into a very common problem: organising your photos so that they can be easily searched and indexed.
Now, you might not know this, but most digital cameras automatically embed descriptive metadata in the headers of the images they create. These headers, called EXchangeable Image File (EXIF) headers, contain information on the camera make and model, the time and date the photo was taken, the technical specifications of the photo (shutter speed, aperture and so on) and a thumbnail of the image. Additionally, many image editors allow you to supplement these automatically generated headers with descriptive text of your own -- for example, "Sally's first football game" or "Getting drunk in Malta".
I'm sure you can see where I'm going with this. With a little bit of imagination and creative thinking, it's possible to use the headers generated by your camera (and, if you have the time and motivation, further supplemented by you) to automatically organise and describe your photo collection. This article will show you how, using PHP's EXIF functions.
Step 1: Make sure your PHP build supports EXIF
In order to read EXIF headers, your PHP build must include support for the EXIF module. You can check whether this support is enabled, by creating a PHP script containing the code shown in Listing A.
Listing A
<?php
phpinfo();
?>
View the output of this script in your Web browser, and review the list of extensions to see if EXIF is included. If it is, move to the next step. If not, you'll need to activate PHP's EXIF functions, either by un-commenting the extension line in php.ini (Windows) or recompiling your PHP build with the --enable-exif argument (UNIX). More information on how to do this is available at the PHP Web site.
Step 2: Move your photos into a single directory
Next, collect all your photos into a single directory under the Web server document root. This is also a good time to add your own descriptive comments to each image (although this is not essential). A number of good shareware and freeware tools are available to help you do this; take a look at Exifer for Windows or RoboPhoto.
Step 3: Write code to read photo headers and comments
The final step is to write the PHP scripts that will extract EXIF data from your images and automatically generate a Web page with thumbnails, technical information and links to larger versions of each image. There are two scripts here: the first one, gallery.php, (See Listing B) looks for photos and extracts EXIF headers from them, while the second one, thumbnail.php, (See Listing C) is responsible for extracting the thumbnail image from each photo.
Listing B
This script uses PHP's directory functions to retrieve a list of all the JPEG images in the directory, and then uses the exif_read_data() function to read the EXIF headers from each image as an array. Each image is displayed as a thumbnail using information provided by thumbnail.php, and each thumbnail is itself hyperlinked to its parent image. Relevant information -- image name, dimensions, timestamp and camera model -- is extracted from these headers and displayed with each thumbnail.
If you used an EXIF editor to add your own comments to the images, you can access the appropriate array elements to retrieve and display that information as well. Look inside the $exif array with print_r($exif) to find out the array path for your custom metadata.
Note: Different camera manufacturers use the EXIF headers in different ways. If the output of the script above appears to be missing some information, you should look inside the $exif array with print_r($exif) to find out exactly how your camera writes the EXIF data, and make appropriate adjustments to the array keys in the script above (Listing B).
Listing C - And here's the code for thumbnail.php
<?php
// define directory path
$dir = ".";
$image = exif_thumbnail($dir . "/" . $_GET['file']);
header("Content-Type: image/jpeg");
echo $image;
?>
This script is very simple -- it retrieves the image file name from the URL and uses the exif_thumbnail() function to extract a thumbnail from the named image. This thumbnail is then sent to the browser, together with an appropriate header, for display.
Place both these scripts in the directory containing your photos, and then use your Web browser to access gallery.php. You should see thumbnails of the images in the directory, together with descriptive information on each. Clicking a thumbnail should take you to the larger parent image.
Figure A is an example screenshot of what the output might look like:
|
| An example screenshot |
And there you have it -- an automatically generated photo gallery! As you copy new images to the folder, they will automatically show up in the gallery listing. Isn't that neat?
Note: You can place the scripts created in Step 3 in a different directory from the one containing your photos, so long as you remember to update the $dir variable at the top of each script with the correct path to the photo collection.
Do you need help with PHP? Gain advice from Builder AU forums
1
Darin Teichmer - 26/06/06
Hi,
I am using your code just as it was provided. I have it copied in the folder which has the images. The code produces the EXIF information but does not display the thumbnails. My print statements seem to show that I am not event entering the thumbnail.php code.
I'm a novice programmer so I am sure it is something simple. If you have any suggestions pleas let me know.
-Darin
» Report offensive content
2
Scott McLeod - 29/06/06
I am having all kinds of problems getting the EXIF information to display. I used Exifer but nothing shows up using exif_read_data (not even with print_r), then I read on their Web site that this is a known problem! The trial version of RoboPhoto can't edit EXIF info (arrgg!) Can you give me a tip on another free EXIF editor that is known to work with PHP?
Thanks,
-- Scott
» Report offensive content
3
Peter - 19/07/06
Darin,
If you are on a windows machine, you may need to add quotes to the generated html, just replace the line that matches the one below (due to page breaks it may cross a couple of lines).
- Enjoy
» Report offensive content
4
Darryn - 10/10/06
Great page about the exif data, it works really well! Can you show me how to run the same code but from a different directory? Ie I have a folder call sydney which contains a folder called images with all my jpg's in it. I'd like to run the code from the sydney folder on the jpg's.
Thanks
» Report offensive content
5
Jason - 11/11/06
I am having the same problems as Darin, the thumbnails don't show up. I added the quotation marks but same problem. Any other ideas?
» Report offensive content
6
Naomi - 30/12/06
Hey Jason,
This line:
imgsrc=thumbnail.php?file=$file
is missing a space. It should be:
img src=thumbnail.php?file=$file
:)
Aweomse code by the way! :) I spent hours looking for this information, and am so happy to have finally find what I was after. Thank you so much!
» Report offensive content
7
Cos - 28/02/07
Fixed the script a bit to work recursively. Basically, its idea is the same thing, but now you can have tree-like directory structure of your images and only on script at the top level of it.
Just put both of these:
http://www.boudnik.org/~cos/consulting/scripting/thubmnails/thumb.php
http://www.boudnik.org/~cos/consulting/scripting/thubmnails/image.php
into the top level directory and call the thumb.php
Don't kick me hard - it's my first PHP experience, actually :-)
Please let me know if there's some problems.
Thanks,
Cos
» Report offensive content
8
johan - 17/05/07
Hi Cos,
Nice script. Would like to try the recursive version. However, I cannot download them from the the links above since they are executed on the server and all I get is the result of the scripts, not the actual scripts.
If could please link to text versions of them (eg "thumb.php.txt") that would be most appreciated.
Thanks
johan
» Report offensive content
9
Joey - 01/06/07
If the file does not contain any exif data, the thumbnail will not show in the index. How do you fix this?
» Report offensive content
10
Bill - 11/12/07
You add exif data to the file.
» Report offensive content
11
nilima - 29/01/08
good code
» Report offensive content
12
John - 24/02/08
Hi everybody (anyone!)
It seems I am having the same problem as a few other people - thumbnails stubbornly will not work! Can anyone offer any guidance on what I am doing wrong? I have EXIF data and the link to the original image works, but there is a lack of thumbnail. Should there be a thumbnail folder, or does the script generate the thumbnails on the fly?
Cheers
John
» Report offensive content
13
johnothan - 08/04/08
hello im jonothan. i like billy berry
» Report offensive content
14
Coma - 11/04/08
Is there a way i can chose the size i want the thumbnails to be create at and the jpg quality?
» Report offensive content
15
Jacob - 18/06/08
Coma,
Yepp. => http://phpthumb.sourceforge.net/#download
» Report offensive content
16
Jacob - 18/06/08
Oh,
And in 'C', the line that says;
echo "Dimensions: " . $exif['COMPUTED']['Height'] . " x " . $exif['COMPUTED']['Height'] . " <br/>";
Should be like this instead:
echo "Dimensions: " . $exif['COMPUTED']['Width'] . " x " . $exif['COMPUTED']['Height'] . " <br/>";
Otherwise you get Height reported as the same size as Width.
ie, an image 640x480 in size is shown as 480x480.
And on this line;
echo "<td valign=top><a href=$dir/$file><imgsrc=thumbnail.php?file=$file></a><td>";
You can add border=0, så you don't get those blue square boxes around your images.
echo "<td valign=top><a href=$dir/$file><img src=get-thumbnail.php?file=$file border=0></a><td>";
» Report offensive content