Simple Bildergalerie mit Blätterfunktion
Um Bilder aus einem Unterordner in PHP auszulesen und eine Bildergalerie mit Thumbnails zu erstellen, kannst du den folgenden Ansatz verwenden:
1. Erstelle einen Unterordner in deinem Projekt, in dem du die Bilder speichern möchtest. Zum Beispiel kannst du ihn "images" nennen.
2. Lade die Bilder in den Unterordner "images" hoch.
3. Verwende die Funktion scandir() in PHP, um die Liste der Dateien im Unterordner abzurufen. Filtere dabei nur nach Bildern.
Anklicken zum Kopieren
$imageDirectory = 'images/';
$allowedExtensions = ['jpg', 'jpeg', 'png', 'gif'];
$files = scandir($imageDirectory);
$imageFiles = array_filter($files, function ($file) use ($allowedExtensions) {
$extension = pathinfo($file, PATHINFO_EXTENSION);
return in_array(strtolower($extension), $allowedExtensions);
});4. Um Thumbnails automatisch zu generieren, kannst du die GD-Bibliothek verwenden, die in PHP enthalten ist. Mit GD kannst du Bilder manipulieren und Thumbnails erstellen.
Anklicken zum Kopieren
$thumbnailDirectory = 'thumbnails/';
$thumbnailSize = 150; // Größe des Thumbnails in Pixel
foreach ($imageFiles as $file) {
$sourceImagePath = $imageDirectory . $file;
$extension = strtolower(pathinfo($file, PATHINFO_EXTENSION));
switch ($extension) {
case 'jpg':
case 'jpeg':
$sourceImage = imagecreatefromjpeg($sourceImagePath);
break;
case 'png':
$sourceImage = imagecreatefrompng($sourceImagePath);
break;
case 'gif':
$sourceImage = imagecreatefromgif($sourceImagePath);
break;
default:
// Dateiformat wird nicht unterstützt
continue 2; // Überspringe die Schleife und fahre mit dem nächsten Bild fort
}
$thumbnailWidth = $thumbnailSize;
$thumbnailHeight = $thumbnailSize;
$sourceWidth = imagesx($sourceImage);
$sourceHeight = imagesy($sourceImage);
if ($sourceWidth > $sourceHeight) {
$thumbnailHeight = intval($sourceHeight / $sourceWidth * $thumbnailWidth);
} else {
$thumbnailWidth = intval($sourceWidth / $sourceHeight * $thumbnailHeight);
}
$thumbnailImage = imagecreatetruecolor($thumbnailWidth, $thumbnailHeight);
imagecopyresampled(
$thumbnailImage,
$sourceImage,
0, 0, 0, 0,
$thumbnailWidth, $thumbnailHeight,
$sourceWidth, $sourceHeight
);
$thumbnailName = $thumbnailDirectory . $file;
switch ($extension) {
case 'jpg':
case 'jpeg':
imagejpeg($thumbnailImage, $thumbnailName);
break;
case 'png':
imagepng($thumbnailImage, $thumbnailName);
break;
case 'gif':
imagegif($thumbnailImage, $thumbnailName);
break;
}
imagedestroy($sourceImage);
imagedestroy($thumbnailImage);
}Stelle sicher, dass du das Verzeichnis "thumbnails" erstellst, in dem die generierten Thumbnails gespeichert werden.
5. Jetzt hast du die Originalbilder im "images"-Ordner und die generierten Thumbnails im "thumbnails"-Ordner. Du kannst sie verwenden, um die Bildergalerie auf deiner Webseite zu erstellen.
Anklicken zum Kopieren
$thumbnailsDirectory = 'thumbnails/';
foreach ($imageFiles as $file) {
$thumbnailPath = $thumbnailsDirectory . $file;
$imagePath = $imageDirectory . $file;
echo '<a href="' . $imagePath . '" target="_blank">';
echo '<img src="' . $thumbnailPath . '" alt="Thumbnail">';
echo '</a>';
}Dieser Code erstellt für jedes Bild einen Link, der das Bild in einem neuen Tab öffnet. Das Thumbnail wird als Bild in der
img-Tags angezeigt.6. Um die Blätterfunktion zu implementieren und die Anzahl der Bilder pro Seite anzugeben, kannst du die
array_chunk()-Funktion verwenden.Anklicken zum Kopieren
$imagesPerPage = 10;
$paginatedImageFiles = array_chunk($imageFiles, $imagesPerPage);
// Hier musst du den aktuellen Seitennummer-Parameter einbeziehen, z. B. durch GET oder POST
$currentPage = isset($_GET['page']) ? $_GET['page'] : 1;
$currentImages = $paginatedImageFiles[$currentPage - 1];
foreach ($currentImages as $file) {
// Erzeuge Thumbnails und erstelle Links wie im vorherigen Schritt
}Du musst sicherstellen, dass du den aktuellen Seitennummer-Parameter in deinem Code richtig verarbeitest, um die richtigen Bilder für die aktuelle Seite anzuzeigen.
Das ist eine grundlegende Anleitung, um eine einfache Bildergalerie mit Thumbnails in PHP zu erstellen. Beachte jedoch, dass es viele weitere Funktionen und Verbesserungen gibt, die du in deine Bildergalerie einfügen kannst, wie z. B. eine Lightbox-Ansicht oder Responsive Design für mobile Geräte.
Der vollständige Code sieht dann so aus:
Anklicken zum Kopieren
<?php
// Funktion zum Auslesen der Dateien im Bilderverzeichnis
function getImagesFromDirectory($directory, $allowedExtensions)
{
$files = scandir($directory);
$imageFiles = array_filter($files, function ($file) use ($allowedExtensions) {
$extension = pathinfo($file, PATHINFO_EXTENSION);
return in_array(strtolower($extension), $allowedExtensions);
});
return $imageFiles;
}
// Funktion zum Generieren von Thumbnails
function generateThumbnail($sourceImagePath, $thumbnailImagePath, $thumbnailSize)
{
$extension = strtolower(pathinfo($sourceImagePath, PATHINFO_EXTENSION));
switch ($extension) {
case 'jpg':
case 'jpeg':
$sourceImage = imagecreatefromjpeg($sourceImagePath);
break;
case 'png':
$sourceImage = imagecreatefrompng($sourceImagePath);
break;
case 'gif':
$sourceImage = imagecreatefromgif($sourceImagePath);
break;
default:
return false; // Dateiformat wird nicht unterstützt
}
$sourceWidth = imagesx($sourceImage);
$sourceHeight = imagesy($sourceImage);
if ($sourceWidth > $sourceHeight) {
$thumbnailHeight = intval($sourceHeight / $sourceWidth * $thumbnailSize);
$thumbnailWidth = $thumbnailSize;
} else {
$thumbnailWidth = intval($sourceWidth / $sourceHeight * $thumbnailSize);
$thumbnailHeight = $thumbnailSize;
}
$thumbnailImage = imagecreatetruecolor($thumbnailWidth, $thumbnailHeight);
imagecopyresampled(
$thumbnailImage,
$sourceImage,
0, 0, 0, 0,
$thumbnailWidth, $thumbnailHeight,
$sourceWidth, $sourceHeight
);
switch ($extension) {
case 'jpg':
case 'jpeg':
$success = imagejpeg($thumbnailImage, $thumbnailImagePath);
break;
case 'png':
$success = imagepng($thumbnailImage, $thumbnailImagePath);
break;
case 'gif':
$success = imagegif($thumbnailImage, $thumbnailImagePath);
break;
}
imagedestroy($sourceImage);
imagedestroy($thumbnailImage);
return $success;
}
// Konfiguration
$imageDirectory = 'images/';
$thumbnailDirectory = 'thumbnails/';
$allowedExtensions = ['jpg', 'jpeg', 'png', 'gif'];
$thumbnailSize = 150;
$imagesPerPage = 10;
// Bilder aus dem Verzeichnis auslesen
$imageFiles = getImagesFromDirectory($imageDirectory, $allowedExtensions);
// Thumbnails generieren
foreach ($imageFiles as $file) {
$sourceImagePath = $imageDirectory . $file;
$thumbnailImagePath = $thumbnailDirectory . $file;
generateThumbnail($sourceImagePath, $thumbnailImagePath, $thumbnailSize);
}
// Blätterfunktion
$paginatedImageFiles = array_chunk($imageFiles, $imagesPerPage);
$currentPage = isset($_GET['page']) ? $_GET['page'] : 1;
$currentImages = $paginatedImageFiles[$currentPage - 1];
?>
<!DOCTYPE html>
<html>
<head>
<title>Bildergalerie</title>
<style>
.thumbnail {
display: inline-block;
margin: 10px;
}
.thumbnail img {
width: 150px;
height: auto;
}
</style>
</head>
<body>
<h1>Bildergalerie</h1>
<?php foreach ($currentImages as $file): ?>
<?php
$thumbnailPath = $thumbnailDirectory . $file;
$imagePath = $imageDirectory . $file;
?>
<div class="thumbnail">
<a href="<?php echo $imagePath; ?>" target="_blank">
<img src="<?php echo $thumbnailPath; ?>" alt="Thumbnail">
</a>
</div>
<?php endforeach; ?>
<?php if (count($paginatedImageFiles) > 1): ?>
<div class="pagination">
<?php for ($i = 1; $i <= count($paginatedImageFiles); $i++): ?>
<a href="?page=<?php echo $i; ?>"><?php echo $i; ?></a>
<?php endfor; ?>
</div>
<?php endif; ?>
</body>
</html>
Du kannst dieses Snippet frei nutzen, auch kommerziell. Ein Link zu meiner Webseite wäre als Dankeschön toll. Vielen Dank! :)
Fehler entdeckt? Schreib mir!
Werbung
Du suchst einen günstigen Anbieter für Webhosting? Netcup hat alles, was du suchst!
Sichere dir jetzt einen 5€-Gutschein für Neukunden!