Home

PHP script to display page of images

Home

This HTML page generator is part of a system designed to create pages of images. It is designed to produce an HTML page showing preview images. The system also includes Pickup which will create and upload image files. To create a single page of previews you will need to upload three system files, all the image preview files, and all the large image files. Each subsequent page will require two system files and all the image files. One system file (in each directory) contains customising details.

To see an example of the image pages please visit My images and click on some of the links to see the directories.

'images.php' is a PHP script that creates an HTML page of image previews. The display can be set to a fixed or variable number of columns and each preview can be clicked to see the larger version. The page contains a header showing the current path and also any sub-directories. This means that images can be grouped in directories and the user can view one directory and also navigate to the other directories to see other image pages.

'images.php' must be installed in the root directory for the website. Each image directory will need two system files and the image files. The first system file is 'index.php' which is a stub that references the 'images.php' file. The second system file is 'index.inc' which contains customising details for the image page. These can include display headings, file search expressions, width and height of the previews, and a list of preview images in the directory.

Each image for display should have two image files in the relevant directory. The first is the preview version (say 320 pixels wide) and the second is the large version that will be shown when the user clicks on the preview. If you need a Windows PC program to create and upload the image files check Pickup as this has been created as part of this system.

The server side part of this system consists of three files :

If you don't want to bother changing 'index.inc' you can run with the defaults. The defaults say that each preview is 320 pixels wide and that each preview file is named 'Txxxxxxx.jpg' and each large image file is named 'Pxxxxxxx.jpg' ('xxxxxxx' must match for each preview and large file). Since the default 'index.inc' lists no images the system will search the directory and show all previews ('Txxxxxxx.jpg') that it finds.

The customisation entries are all PHP declarations :

$title          = 'Phelum image page generator';
$listheading    = '<h3>Click on any preview to see larger image</h3>';

$filespec       = '^T.*\.JPG$';         // previews are Txxxxxxx.jpg
$repchar        = 'PSM';                // large images are Pxxxxxxx.jpg
                                        //               or Sxxxxxxx.jpg
                                        //               or Mxxxxxxx.jpg
$thumbwidth     = 320;                  // preview images are
$thumbheight    = 240;                  // 320*240 by default.
$tablecols      = 2;                    // 2 column preview list.

More documentation and examples concerning the customising entries is at the start of the 'images.php' file. Setting $tablecols to zero will cause a flexible display that adjusts to suit the user's window width. Captions can be specified and will appear under each preview.


Last Modified : 2007-03-04