Come creare una FotoGallery automatica che pesca le immagini in automatico da una cartella,
scritto in php e JQuery, con Alt automatico a partire dal nome del file.
1) Mettere tutte le foto nella cartella "images/gallery/"
saranno scansionate in automatico:
2) Tutti i TITOLI saranno creati in automatico a partire dal nome dell'immagine
$filename = substr($image_file, 0, $dot);
3) Tutti gli attributi "ALT" saranno creati in automatico a partire dal nome dell'immagine
$alt = str_replace("-", " ", $filename);
4) La funzione Lightbox è affidata al plugin prettyPhoto di JQuery
Script:
<div class="gallery-section clearfix">
<?php
/* Artigiani Del Web - Fotogallery automatica */
function lightbox_display($dir_to_search, $rel){
$image_dir = $dir_to_search;
$dir_to_search = scandir($dir_to_search);
$image_exts = array('gif', 'jpg', 'jpeg', 'png');
$excluded_filename = '_t';
$number = 1;
foreach ($dir_to_search as $image_file){
$dot = strrpos($image_file, '.');
$filename = substr($image_file, 0, $dot);
$alt = str_replace("-", " ", $filename);
$filetype = substr($image_file, $dot+1);
$thumbnail_file = strrpos($filename, $excluded_filename);
if ((!$thumbnail_file) and array_search($filetype, $image_exts) !== false){?>
<div class="one-forth <?php if($number % 4 == 0){ echo "last-col";}?>">
<div class="gallery-item">
<div class="gallery-thumbnail">
<a href="<?php echo $image_dir.$image_file; ?>" rel="<?php echo $rel; ?>">
<span class="zoom-wrapper">
<span class="zoom"></span>
</span>
<img class="attachment-photo-gallery" src="<?php echo $image_dir.'/thumb/'.$image_file; ?>" alt="<?php echo $alt; ?>">
</a>
</div>
<h4><a href="<?php echo $image_dir.$image_file; ?>" rel="<?php echo $rel; ?>"><?php echo $alt; ?></a></h4>
</div>
</div>
<?php
$number++;
}
}
}
lightbox_display('images/gallery/', 'prettyPhoto');
?>
</div>
Potete vedere lo script in azione qui:
http://cercuiabrionlus.org/gallery
scritto in php e JQuery, con Alt automatico a partire dal nome del file.
1) Mettere tutte le foto nella cartella "images/gallery/"
saranno scansionate in automatico:
$dir_to_search = scandir($dir_to_search);
2) Tutti i TITOLI saranno creati in automatico a partire dal nome dell'immagine
$filename = substr($image_file, 0, $dot);
3) Tutti gli attributi "ALT" saranno creati in automatico a partire dal nome dell'immagine
$alt = str_replace("-", " ", $filename);
4) La funzione Lightbox è affidata al plugin prettyPhoto di JQuery
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script> <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js'></script> <script type='text/javascript' src='http://cercuiabrionlus.org/js/jquery.prettyPhoto.js'></script>
Script:
<div class="gallery-section clearfix">
<?php
/* Artigiani Del Web - Fotogallery automatica */
function lightbox_display($dir_to_search, $rel){
$image_dir = $dir_to_search;
$dir_to_search = scandir($dir_to_search);
$image_exts = array('gif', 'jpg', 'jpeg', 'png');
$excluded_filename = '_t';
$number = 1;
foreach ($dir_to_search as $image_file){
$dot = strrpos($image_file, '.');
$filename = substr($image_file, 0, $dot);
$alt = str_replace("-", " ", $filename);
$filetype = substr($image_file, $dot+1);
$thumbnail_file = strrpos($filename, $excluded_filename);
if ((!$thumbnail_file) and array_search($filetype, $image_exts) !== false){?>
<div class="one-forth <?php if($number % 4 == 0){ echo "last-col";}?>">
<div class="gallery-item">
<div class="gallery-thumbnail">
<a href="<?php echo $image_dir.$image_file; ?>" rel="<?php echo $rel; ?>">
<span class="zoom-wrapper">
<span class="zoom"></span>
</span>
<img class="attachment-photo-gallery" src="<?php echo $image_dir.'/thumb/'.$image_file; ?>" alt="<?php echo $alt; ?>">
</a>
</div>
<h4><a href="<?php echo $image_dir.$image_file; ?>" rel="<?php echo $rel; ?>"><?php echo $alt; ?></a></h4>
</div>
</div>
<?php
$number++;
}
}
}
lightbox_display('images/gallery/', 'prettyPhoto');
?>
</div>
Potete vedere lo script in azione qui:
http://cercuiabrionlus.org/gallery
Commenti
Posta un commento