array(array(url1, desc1fr, desc1en), array(url2, desc2fr, desc2en)), pic2=>...) - $margin_top : array of pixels numbers, useful to define margin-top css property when using layout 2 (centered pictures in black boxes, and vertically-centering using css can be a pain, so I defined variable margin tops. $picperpage : blank or unlimited, or some value. Number of thumbnails on a page. The DATAFILE file can be easily created and edited using another script I created to edit gallery. Check this website for "gallery management". 3. CSS : Since the
tag has already been sent off when calling this gallery creation function, you need to add these CSS excerpts to you own stylesheet(s). 3.0. General CSS : div.gallerypage {background-color:#FFFFFF; width:80%; margin-left:auto; margin-right:auto;padding-right:20px; padding-left:20px; padding-top:20px; padding-bottom:20px; } This one above is used for thumbnails view. div.bigpage{background-color:#FFFFFF; width:100%; margin-left:auto; margin-right:auto; padding-right:20px; padding-left:20px; padding-top:20px; padding-bottom:20px;} This one above is used for the full-sized picture. div.clearer{clear:both;} This is a CSS trick to "clear" th flow of floating divs. 3.1. CSS for layout 1 (created March 2004) : div.left {float:left; width:40%; margin-top:0.5em; margin-bottom:0.5em;clear:left;} div.right{float:left; width:60%;margin-top:0.5em; margin-bottom:0.5em; clear:right;}div.clearer{clear:both;} img.cadre {border:solid 1px; border-color:#000000;} This one is rather simple, one left-aligned thumb per line, and its right-aligned description, then a separator. 3.2. CSS for layout 2 (created April 2004, then refactored) : div.tiers {float:left; width:33.3%; text-align:center; margin-top:10px;margin-bottom:10px;} div.noir {background-color:black; width:245px; height:245px;margin-right:auto; margin-left:auto;text-align:center;padding-left:1px; padding-right:1px;} p.reduit {font-size:9pt; color:#FFFFFF; } div.noir img{padding:0px;} Still perfectible, this will show three pictures per line, each in a black square. I had troubles with vertical alignment of images into black divs so played with margin-top of images... This render fine under 1024*768 resolution. You can have some short description below each picture. 4. Additional notes : I have an additional footer() function that allows me to include some stuff to get statistics on my web pages (the require statement to include the code of xiti() function is somewhere else). Feel free to remove it, then you can remove the "titre" parameter as well. Or have your own footer instead. 5. Acknowledgments : Many thanks to Photo Gallery script that gave me a boost to go and create my own one, from : http://tuma.stc.cx/gallery.php Tuomas AiraksinenGallery initialization warning : no $_SESSION[\'lang\'] constant defined before calling function !
'); // fallback $_SESSION['lang']='en'; } switch($_SESSION['lang']){ case 'en' : define('CLICK_ON_PIC', 'Click on pictures to see them larger'); define('PAGE', 'Page'); define('UNEXISTANT', 'does not exist'); define('CLICK_BACK_GAL', 'Click here to go back to gallery'); define('LIB_PREVIOUS', 'Previous'); define('LIB_NEXT', 'Next'); define('LIB_START', 'Start of gallery'); define('LIB_END', 'Last picture of gallery'); break; case 'fr' : define('CLICK_ON_PIC', 'Cliquez sur les images pour les voir en grande taille'); define('PAGE', 'Page'); define('UNEXISTANT', 'n\'existe pas'); define('CLICK_BACK_GAL', 'Cliquez ici pour revenir à la galerie'); define('LIB_PREVIOUS', 'Précédent'); define('LIB_NEXT', 'Suivant'); define('LIB_START', 'Début de la galerie'); define('LIB_END', 'Dernière image de la galerie'); break; } } // function that is to use when one wants ONE gallery on the page // $url, $titre, $picdir, $layout, $hide_desc function gallery($url, $titre, $picdir, $layout, $hide_desc){ init_params(); $action=$_REQUEST['action']; $fichier = $_REQUEST['fichier']; switch($action) { case "showpicture" : echo('');
// second, explode in strings with line breaks. the last output string isn't followed by
$exploded_desc2= explode('\n', $para);
$size = count($exploded_desc2);
$count_s = 1;
foreach($exploded_desc2 as $count_s => $string) {
if($count_s < $size) {
echo($string . '
');
}
else {
echo($string);
}
}
echo('
'. CLICK_ON_PIC .'
'); if($_SESSION['lang']=='fr'){ $indexl=0; } else{ $indexl=1; } $multipage = false; $maxpage=0; if(isset($picperpage) and $picperpage != 'unlimited'){ // multipage $multipage = true; $total=count($fichiers); // adjustment if maximum set per pages picture > $total if($picperpage > $total){ $picperpage = $total; $multipage = false; } if($multipage) { $firstpic=0; $lastpic=$total -1; $page=0; $maxpage = ceil($total / $picperpage); if(isset($_REQUEST['page'])){ $page=$_REQUEST['page']; } else{ $page =1; } $firstpic= ($page -1) * $picperpage; $lastpic=($page * $picperpage) -1; // lastpic control if($lastpic > ($total -1)){ $lastpic=$total -1; } // firstpic control if($firstpic > ($total -1)) { $firstpic=($maxpage -1) * $picperpage; $lastpic=$total -1; echo('' . PAGE . ' . $page . ' . NON_EXISTANT.'
'); } // now we extract the part we want and keep the key for later use $fichiers_temp = array(); foreach($fichiers as $key => $val){ if($key >= $firstpic and $key <= $lastpic){ $fichiers_temp[$key] = $val; } } if($maxpage ==1){ // a single-paged gallery is not a multipage one ! $multipage = false; } $fichiers=$fichiers_temp; } } if($multipage){ links_page($url, $page, $maxpage); echo(''.normalize_my_output($descriptions[$counter][$indexl]).'
'); echo_linked_urls(trim_extension($fichier), $urls_keys); echo(''.normalize_my_output($legendes[$counter][$indexl]).'
'); } echo(''.normalize_my_output($descriptions[$counter][$indexl]).'
'); } echo_linked_urls(trim_extension($filename), $urls_keys); // if more than one picture ! $max=count($fichiers); if($max > 1) { // set previous and next pictures index switch($counter){ case 0 : $ind_previous=$max -1; $ind_next=1; $lib_previous=LIB_END; $lib_next=LIB_NEXT; break; case $max -1 : $ind_previous=$max -2; $ind_next=0; $lib_previous=LIB_PREVIOUS; $lib_next=LIB_START; break; default : $ind_previous=$counter -1; $ind_next=$counter + 1; $lib_previous=LIB_PREVIOUS; $lib_next=LIB_NEXT; break; } } // now picture surrounded with links at the corners $temp=getimagesize($picdir . '/' . BIG . '/' . $filename); if($max > 1) { linked_pics($fichiers, $url, $max, $ind_previous, $ind_next, $lib_previous, $lib_next, $gnum); } echo('[ ' . $nb_previous . '/' .$max_nb . ' ]
[ ' . $nb_next . '/' .$max_nb . ' ]