Matthew Hipkin

Dynamic Directory To HTML script


A simple PHP-based script that creates a pretty directory listing from the files in the current directory.


Simply copy index.php and the .dirtohtml directory to the directory you wish to use.


All configuration options are found in .dirtohtml/

 $config = array();
// Page background colour
$config['bgcolour'] = "#BCBCDE";
// Main text colour
$config['textcolour'] = "#000000";
// Font
$config['font'] = "sans-serif";
// Font size - standard CSS units apply
$config['fontsize'] = "8pt";
// Display area width - standard CSS units apply
$config['width'] = "700px";
// Cell border colour
$config['bordercolour'] = "#000000";
// Cell border width & style
$config['borderwidth'] = "1px solid";
// Cell background colour
$config['cellbg'] = "#C0C0C0";
// Second cell background colour (optional)
$config['cellbg2'] = "#B3E7FF";
// Link colour
$config['linkcolour'] = "#FF0000";
// Header colour
$config['headcolour'] = "#FFFFFF";
// Date format
$config['date'] = "d F Y H:i:s";
// Order by filename, size or date
$config['order'] = "filename";
// Path to icons
$config['imgpath'] = ".dirtohtml/img";

File icons

One of the features of this script is loading file type icons, this script makes it easy to use open source icon sets for KDE and GNOME, simply copy the mimetypes directory into the .dirtohtml/img directory (or alter the configuration file for another directory). As some of the filenames in a theme's mimetypes directory does not directly match file extensions I have written this script to allow aliases to be used. At the bottom of you will see I have already setup a few common aliases:

 $fileTypes = Array();
$fileTypes['jpg'] = "image";
$fileTypes['gif'] = "image";
$fileTypes['png'] = "image";
$fileTypes['odt'] = "document";
$fileTypes['mp3'] = "sound";
$fileTypes['mov'] = "quicktime";
$fileTypes['c'] = "source_c";
$fileTypes['cpp'] = "source_cpp";
$fileTypes['pl'] = "source_pl";
$fileTypes['py'] = "source_py";
$fileTypes['h'] = "source_h";
$fileTypes['sh'] = "shell1";
$fileTypes['xls'] = "spreadsheet";
$fileTypes['iso'] = "cdimage";
$fileTypes['avi'] = "video";
$fileTypes['wmv'] = "video";
$fileTypes['mp4'] = "video";
$fileTypes['gz'] = "tgz";
$fileTypes['bz2'] = "zip";
$fileTypes['7z'] = "zip";
$fileTypes['exe'] = "exec_wine";

The basic format is $fileTypes['ext'] = "filename";

I have included icons from the Crystal Clear icon set by Everaldo Coelho, available from

You can browse sites such as KDE-Look and GNOME-Look for more themes.

blog comments powered by Disqus