Lightbox-Automatisierung

Jetzt habe ich mich endlich mal dazu durchgerungen die Erstellung von Lightbox-Gallerien zu automatisieren. Den letzten Ausschlag gab das Page-Speed Plugin für die Chrome-Entwicklertools.

Ich benutze das JQuery-Plugin colorbox.js von Jack Moore

Auf der Primal Scream Tattoo-Seite beschwerte sich Page Speed über nicht vorhandene Thumbnails. Und mir ging das händische Verlinken der einzelnen Bilder schon lange auf die Nerven. Die Thumbnails lassen sich ja leicht generieren. Das Script hier bietet eine gute Basis. Ein paar kleine Änderungen und schon funktioniert es.

Jetzt muss nur noch für jedes Bild in dem Ordner ein Link auf das Original erstellt werden und in den Link das Bild aus dem zugehörigen Thumbnail eingebaut werden.

Aus einem Tutorial, dass ich vor einiger Zeit mal durchgegangen bin, hatte ich schon einen Grossteil des Scripts fertig. Beide Teile zusammengebaut, kurz getestet und funktioniert!

War 30 Minuten Arbeit und spart bei jeder Aktualisierung mindestens 5 Minuten pro ausgetauschtem Bild!
Hier der fertige Code (Danke an die beiden Tutorial-Schreiber):

<?php

function mkthumb($img_src, // Dateiname
$img_width = "120", // max. Größe in x-Richtung
$img_height = "120", // max. Größe in y-Richtung
$folder_src = "pics", // Ordner der normalen Bilder
$des_src = "thumbs") // Ordner der Thumbs
{
$image = imagecreatefromjpeg($folder_src."/".$img_src);
list($src_width, $src_height) = getimagesize($folder_src."/".$img_src);
if($src_width >= $src_height)
{
$new_image_width = $img_width;
$new_image_height = $src_height * $img_width / $src_width;
}
if($src_width < $src_height)
{
$new_image_height = $img_width;
$new_image_width = $src_width * $img_height / $src_height;
}
$new_image = imagecreatetruecolor($new_image_width, $new_image_height);
imagecopyresampled($new_image, $image, 0, 0, 0, 0, $new_image_width,$new_image_height, $src_width, $src_height);
imagejpeg($new_image, $des_src."/".$img_src, 100);
RETURN TRUE;
}
?>
<!-- Ausgabe der Bilderliste !-->
<p>
<?php
$folder_src = "pics"; // Ordner der normalen Bilder
$des_src = "thumbs"; // Ordner der Thumbs
$allebilder = scandir($folder_src); // Sortierung A-Z

foreach ($allebilder as $bild) {
$bildinfo = pathinfo($folder_src."/".$bild);

if ($bild != "." && $bild != ".." && $bild != "_notes" && $bildinfo['basename'] != "Thumbs.db") {
if(!file_exists($des_src."/".$bild))
mkthumb($bild);
?>

<a class="gallery" href="<?php echo $bildinfo['dirname']."/".$bildinfo['basename'];?>">
<img src="<?php echo $des_src."/".$bildinfo['basename'];?>" alt="Vorschau" /></a>

<?php
};
};
?>
<p>

Date
Categories
Tags
Permalink
Status

Veröffentlicht:19. März 2012

Allgemein Blog

Bookmark the permalink

Kommentieren oder einen Trackback hinterlassen: Trackback-URL


Einen Kommentar hinterlassen

Your email is never published nor shared. Erforderliche Felder sind mit * markiert

Sie können diese HTML-Tags und -Attribute verwenden <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

*
*