May
15

Really simple PHP gallery script

15 May 2009 by tonie in PHP

Right. Have you ever wanted to just log on with your FTP account, upload a bunch of pictures and do nothing more to create a good looking gallery page. Well, this is exactly what this script does. No complicated uploading techniques, just log on with your FTP account and put the pictures you want in different folders, which represent the corresponding albums.

Prerequisites

We are going to use 2 ready scripts. First we're going to use the phpThumb class, which will create automatically our thumbnails and second, we are going to use lightbox to create some fancy effects. Go ahead and download them from their official locations.

The script

Then create a new document called gallery.php, extract the content from the archives and also remember to create an empty dir, called albums, where you will store albums and pictures. Here's the HTML part.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Simple gallery</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="stylesheet" href="lightbox/css/lightbox.css" type="text/css" media="screen" />
<script src="lightbox/js/prototype.js" type="text/javascript"></script>
<script src="lightbox/js/scriptaculous.js?load=effects,builder" type="text/javascript"></script>
<script src="lightbox/js/lightbox.js" type="text/javascript"></script>
</head>
<body>
<!-- Put your PHP code here -->
</body>
</html>

And the PHP part:

<?php
function ext($filename) {
    return end(explode('.', $filename));
}
$width='100';
$height='80';
$dir='albums';
$albums=array();
if ($h=opendir($dir)) {
    while ($object=readdir($h)) {
        if ($object!='.' && $object!='..') {
            if (is_dir($dir.'/'.$object)) {
                if ($h2=opendir($dir.'/'.$object)) {
                    while($o2=readdir($h2)) {
                        if (!is_dir($dir.'/'.$object.'/'.$o2)) {
                            if (ext($o2)=='jpg' || ext($o2)=='jpeg') {
                                $albums["$object"].=$o2.',';
                            }
                        }
                    }
                    $albums["$object"]=rtrim($albums["$object"],',');
                    closedir($h2);
                }
            }
        }
    }
    closedir($h);
}
if (!empty($albums)) {
    foreach ($albums as $album=>$pics) {
        echo '<h3>'.$album.'</h3>';
        $pics_array=explode(',',$pics);
        foreach ($pics_array as $pic) {
            if (empty($pic)) {
                echo '<strong>There are no pictures associated with this album</strong>';
            } else {
                echo '<div style="float:left;">';
                echo '<a href="'.$dir.'/'.$album.'/'.$pic.'" rel="lightbox['.$album.']">';
                echo '<img src="phpthumb/phpThumb.php?src=../'.$dir.'/'.$album.'/'.$pic.'&amp;w='.$width.'&amp;h='.$height.'&amp;zc=1" />';
                echo '</a>';
                echo '</div>';
            }
        }
        echo '<div style="clear: both;"></div>';
    }
} else {
    echo '<h1>There are no albums right now.</h1>';
}
?>

That's it. To create another album, simply create a folder inside albums and fill it in with pictures. Feel free to modify the CSS styles as you like

Cheers, T.

php, gallery, thumbnail, tutorial, lightbox

Speak your mind ( 1 Comment)

#1 by chenxy on 24/6/10

good js, but can you share examples of packag?
thanks...

If you liked the article and want to contribute to it, please feel free to leave your comment. HTML tags are not allowed, but you can use the following BBCode to enhance your message: [url] [quote] [code] [b] [i] [u] [color].