Créer une galerie photo avec zone administration(Edit)Pour ajouter une galerie avec gestion des photos via l'administration des médias, on va créer un template static-galery.php. Pour se faire copiez dans le même dossier le fichier static.php de votre thème et renommez la copie en static-galery.php Dans static-galery.php après: <?php $plxShow->staticContent(); ?> ajoutez ce morceau de code:(Edit)<script src="<?php $plxShow->template(); ?>/lightbox2.5/js/jquery-1.7.2.min.js"></script> <script src="<?php $plxShow->template(); ?>/lightbox2.5/js/lightbox.js"></script> <link href="<?php $plxShow->template(); ?>/lightbox2.5/css/lightbox.css" rel="stylesheet" /> <style type='text/css'> .gal { margin-top:25px; margin-left:75px; } .pic{ float:left; margin:5px 5px 5px 5px; border:0px none transparent; width:120px; height:120px; box-shadow: 0px 0px 0px #666 inset; -o-box-shadow: 0px 0px 0px #666 inset; -ms-box-shadow: 0px 0px 0px #666 inset; -moz-box-shadow: 0px 0px 0px #666 inset; -khtml-box-shadow: 0px 0px 0px #666 inset; -webkit-box-shadow: 0px 0px 0px #666 inset; border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5px; -webkit-border-radius: 5px; transition: box-shadow 250ms linear; -o-transition: -o-box-shadow 250ms linear; -ms-transition: -ms-box-shadow 250ms linear; -moz-transition: -moz-box-shadow 250ms linear; -khtml-transition: -khtml-box-shadow 250ms linear; -webkit-transition: -webkit-box-shadow 250ms linear; } .pic:hover{ box-shadow: 3px 3px 5px #666 inset; -o-box-shadow: 3px 3px 5px #666 inset; -ms-box-shadow: 3px 3px 5px #666 inset; -moz-box-shadow: 3px 3px 5px #666 inset; -khtml-box-shadow: 3px 3px 5px #666 inset; -webkit-box-shadow: 3px 3px 5px #666 inset; } .pic a{ width:120px; height:120px; text-indent:-99999px; display:block;} .pic a, .pic a:visited {outline:none;} </style> <?php $_get=plxUtils::getGets(); $id=explode('/',$_get); $directory = 'data/images/'.$id[1]; //where the gallery images are located $allowed_types=array('jpg','jpeg','gif','png'); //allowed image types $file_parts=array(); $ext=''; $title=''; $i=0; //try to open the directory $dir_handle = @opendir($directory) or die("There is an error with your image directory!"); echo '<div class="gal">'; while ($file = readdir($dir_handle)) //traverse through the files { if($file=='.' || $file == '..') continue; //skip links to the current and parent directories $file_parts = explode('.',$file); //split the file name and put each part in an array $ext = strtolower(array_pop($file_parts)); //the last element is the extension $title_origin = implode('.',$file_parts); //once the extension has been popped out, all that is left is the file name $title = htmlspecialchars($title_origin); //make the filename html-safe to prevent potential security issues $nomargin=''; if(in_array($ext,$allowed_types) and !in_array('tb',$file_parts)) //if the extension is an allowable type { if(($i+1)%4==0) $nomargin='nomargin'; //the last image on the row is assigned the CSS class "nomargin" echo ' <div class="pic '.$nomargin.'" style="background:url('.$directory.'/'.$title_origin.'.tb.'.$ext.') no-repeat 50% 50%;"> <a href="'.$directory.'/'.$file.'" title="'.$title.'" target="_blank" rel="lightbox[roadtrip]">'.$title.'</a> </div>'; $i++; //increment the image counter } } echo '</div>'; ?> vous constaterez que j'utilise lightbox2.5 pour cet exemple, le dossier lightbox2.5 doit se trouver dans le dossier de votre thème. Création d'une page statique:(Edit)À partir de là, le processus est simple. À la création d'une page statique nommez la page, dans le champs URL, mettez galerie-1 et cliquez sur Modifier la liste des pages statiques Une fois ajouté, cliquez sur le lien Éditer de votre nouvelle page. Dans template, choisissez static-galery.php, éditez votre page et sauvegardez le tout. Administration de la galerie(Edit)Maintenant, allons dans l'administration des médias et plus précisément dans les images. A la racine ajoutez un dossier nommé galerie-1 comme le champ URL de notre page statique. Dans ce dossier, ajoutez les photos que vous voulez. Et voilà votre galerie est prête, et on a même droit à une zone admin pour la gérer :) je précise que le code php et une adaptation d'un script vu sur la toile qui traitait de galerie photos avec Shadowbox sur pluxml. ++ BeHuman |
||