XMLAlbum

Features | Instructions | XML Database | Creative Commons Metadata | Screenshots | Download

Features

XMLAlbum is an easy-to-configure PHP script that uses information stored in an XML file to display thumbnails and photos/images. The images do not have to be stored in a single, parent directory; rather, they can be buried in subdirectories. The XML file stores each image's name and absolute path, the latter of which doubles as a unique identifier. Plus, Creative Commons licensing information for individual images (among other metadata) can easily be embedded in the XML database.

Instructions

First and foremost, if the directory containing your images does not lie under the document root of your server, then create an alias (in Apache) or a virtual directory (in IIS) pointing to the images directory, and give the alias (or virtual directory) the same name as the music directory. For example, if your images directory is /home/user/images, then you should create an alias called /images.

De-compress the source into your directory of choice.Configure the options presented in config.php (they are are well-explained in the file).

XML Database

Next, create an XML file containing information about your images -- a relatively simple process. After creating a blank XML file (we'll call it images.xml, although you can name it whatever you like), add a document root element. We'll call it folder (the only tag name that matters -- image -- is that for nodes representing actual images):

Code Listing 1: Contents of images.xml

<folder />

Next, add two attributes to the document root element: id, and doc_root. The value of the id attribute is the absolute path (not full path) of the directory containing the images. The value of the doc_root attribute is the portion of the full path to the images directory excluding what is contained in the id attribute. For the setup mentioned in the first paragraph of Instructions, the doc_root value would be /home/user, and the id attribute would be /images. Note that trailing forward slashes are not included in directory paths.

Code Listing 2: Document root element of images.xml

<folder id="/images" doc_root="/home/user" />

Finally, underneath the document root, create a hierarchical representation of the images in the directory, making sure that each node in the XML document contains an id attribute (containing the absolute path to the folder/image element) and a name attribute (representing the title of the folder/image element). For example, for the following structure (where /home/user/images is the root of the images directory),

Code Listing 3: Hierarchical representation of images directory

• /home/user/images
  • /home/user/images/Greek sculptures
    • /home/user/images/Greek sculptures/Black and white sculpture.jpg
    • /home/user/images/Greek sculptures/Golden statue.jpg
    • /home/user/images/Greek sculptures/Horse head in stone.jpg
    • /home/user/images/Greek sculptures/Wall siding.jpg
  • /home/user/images/Billboards
    • /home/user/images/Billboards/Einstein's billboard.jpg

the corresponding XML would be

Code Listing 4: XML representation of images directory

• <folder id="/images" name="Images" doc_root="/home/user">
  • <folder id="/home/user/images/Greek sculptures" name="Greek Sculptures">
    • <image id="/home/user/images/Greek sculptures/Black and white sculpture.jpg" name="Black and white sculpture" />
    • <image id="/home/user/images/Greek sculptures/Golden statue.jpg" name="Golden statue of a man standing up" />
    • <image id="/home/user/images/Greek sculptures/Horse head in stone.jpg" name="Horse head" cc-license="by-nc-sa" author="Han Solo" date="May 19, 2005" />
    • <image id="/home/user/images/Greek sculptures/Wall siding.jpg" />
  • </folder>
  • <folder id="/home/user/images/Billboards" name="Billboards">
    • <image id="/home/user/images/Billboards/Einstein's billboard.jpg" name="Apple Think Different billboard with Einstein" />
  • </folder>
• </folder>

Finishing Up

Finally, create a previews directory, where thumbnails will be generated and stored. This directory must be writeable (i.e., chmod 755 [dir]). Configure the four options presented in config.php. The documentation around these options should be more than sufficient. The script itself is titled index.php. A sample XML database is also included, images.xml.

Optional: Creative Commons Metadata

Creative Commons licensing metadata for certain images can be easily incorporated. In the XML file, simply add the attribute cc-license to an image node, along with a value corresponding to the type of license. You may also add the attributes author (corresponding to the image's author) and date (corresponding to the date of creation). Here is an example of an image node to which CC licensing metadata has been added:

Code Listing 5: Node containing embedded Creative Commons metadata

<image id="/images/Greek sculptures/Horse head in stone.jpg" name="Horse head" cc-license="by-nc-sa" author="Han Solo" date="May 19, 2005"/>

Screenshots

Running the script displays all the subdirectories and files of the parent images directory.

Tiled thumbnails automatically generated and displayed for the subdirectory "Greek sculptures". Note the bread-crumb trail paved at the top, for convenient hierarchical browsing.

A single image being displayed. Here, the image is licensed under a Creative Commons Attribution-Noncommercial-ShareAlike license (for demonstration purposes only; the image isn't really licensed under a CC license).

Download

Visit the SourceForge page for latest releases.