Ein zufälliges Hintergrundbild kann natürlich auch mit Contao, mit dem Modul "Zufallsbild" realisiert werden.
Möchte man aus irgendweinem Grund darauf verzichten, dann kann man ein zufälliges Hintergrundbild auch mithilfe von PHP realisieren.
So geht man dabei vor:
1. Ordner mit den Zufallsbildern erstellen, z. B. unter /tl_files/img/bg/ und eurer Bilder hier ablegen.
2. PHP-Datei, z. B. mit dem Namen rotate.php erstellen und ebenfalls in dem Ordner /tl_files/img/bg/ ablegen.
PHP-Code:
<?php
/* ------------------------- Konfiguration -----------------------
Verzeichnispfad der Hintergrundbilder.
Befindet sich die rotate.php im gleichen Ordner wie die Bilder, dann $folder = '.'
*/
$folder = '.';
/* Welche Dateitypen sollen unterstützt werden? */
$extList = array();
$extList['gif'] = 'image/gif';
$extList['jpg'] = 'image/jpeg';
$extList['jpeg'] = 'image/jpeg';
$extList['png'] = 'image/png';
// --------------------- Ende Konfiguration -----------------------
$img = null;
if (substr($folder,-1) != '/') {
$folder = $folder.'/';
}
if (isset($_GET['img'])) {
$imageInfo = pathinfo($_GET['img']);
if (
isset( $extList[ strtolower( $imageInfo['extension'] ) ] ) &&
file_exists( $folder.$imageInfo['basename'] )
) {
$img = $folder.$imageInfo['basename'];
}
} else {
$fileList = array();
$handle = opendir($folder);
while ( false !== ( $file = readdir($handle) ) ) {
$file_info = pathinfo($file);
if (
isset( $extList[ strtolower( $file_info['extension'] ) ] )
) {
$fileList[] = $file;
}
}
closedir($handle);
if (count($fileList) > 0) {
$imageNumber = time() % count($fileList);
$img = $folder.$fileList[$imageNumber];
}
}
if ($img!=null) {
$imageInfo = pathinfo($img);
$contentType = 'Content-type: '.$extList[ $imageInfo['extension'] ];
header ($contentType);
readfile($img);
} else {
if ( function_exists('imagecreate') ) {
header ("Content-type: image/png");
$im = @imagecreate (100, 100)
or die ("Cannot initialize new GD image stream");
$background_color = imagecolorallocate ($im, 255, 255, 255);
$text_color = imagecolorallocate ($im, 0,0,0);
imagestring ($im, 2, 5, 5, "IMAGE ERROR", $text_color);
imagepng ($im);
imagedestroy($im);
}
}
?>
3. In eurer CSS-Datei, welche z. B. unter /tl_files/css/style.css zu finden ist, könnte ihr nun das Zufallsbild wie folgt ansprechen:
HTML-Code:
body {
background: #FFF url(../img/bg/rotate.php) 0 0 no-repeat;
}
4. Fertig. Viel Spaß damit!
Lesezeichen