Tutorial - Wechselnde Bilder auf einer Introseite bei Joomla


Skript, um ein zufälliges Bild in einer vorgeschalteten Seite bei Joomla anzuzeigen.

Im Joomlaportal wurde bereits öfters angefragt, wie man eine Introseite aktivieren kann.

Dieses Tutorial zeigt eine einfache Lösung, wie man so eine Vorschalteseite mit einem Zufallsbild (wie im Random Image Modul) realisiert. Die erstellten Dateien können am Ende des Tutorials auch runtergeladen werden!

1. Datei index.html anlegen

Zuerst wird die Introseite index.html angelegt:

<html> <head> <title>Introseite bei Joomla</title> </head> <body> <div> <a href="/index.php" title="Beschreibung"><img src="/rotate.php" alt="Beschreibung" /></a> </div> </body> </html> 

Hierbei handelt es sich um ein minimales HTML-Grundgerüst. In diesem Beispiel ist das Bild auch nicht ausgerichtet. Weitere Informationen und Styles sollten nach individuellen Anforderungen hinzugefügt werden.

Als Bild wird die Datei rotate.php ausgegeben. Dieses Skript ermöglicht die zufällige Ausgabe von Bildern aus einem gewählten Bildordner. Beim Aufruf des Skriptes wird ein zufälliges Bild zurückgegeben, welches mit Hilfe des img-Attributs angezeigt wird.

Normalerweise sollte die index.html vor der index.php von Joomla geladen werden. Ist das nicht der Fall, kann das durch eine zusätzliche Zeile in der .htaccess erzielt werden:

DirectoryIndex index.html index.php

2. Skript rotate.php erstellen

rotate.php anlegen:

<?php /* Modifiziert durch Viktor Vogel - www.kubik-rubik.de Skript basiert auf Random Image von Matt Mulleneweg */ // Bilderordner angeben. Es müssen relative Pfade verwendet werden, z.B.: "images/". // Befinden sich die Bilder im gleichen Ordner wie das Skript, dann nicht verändern. $folder = ''; // Bildtypen, die angezeigt werden sollen. Eingabe mit Komma trennen. $exts = 'jpg,jpeg,png,gif'; if ( $folder == '' ) { $folder = './'; } $handle = opendir($folder); $exts = explode(',', $exts); $files = array(); $i = -1; while ( ($file = readdir($handle)) !== false ) { foreach($exts as $ext) { if (preg_match('/\.'.$ext.'$/i', $file)) { $files[] = $file; $i++; } } } closedir($handle); if ( empty($files) ) { $no_images = imagecreate(600, 400); $black = imagecolorallocate($no_images, 0, 0, 0); $white = imagecolorallocate($no_images, 255,255,255); imagestring($no_images, 5, 40, 200, "Kein Bild vorhanden. Bildordner in der rotate.php angeben!", $white); header("Content-type: image/png"); imagepng($no_images); } else { mt_srand((double)microtime()*1000000); $rand = mt_rand(0, $i); header('Location: '.$folder.$files[$rand]); } ?> 

Das Skript ist relativ einfach aufgebaut. Es werden Dateien (abhängig von der eingestellten Endung) eingelesen und zufällig ausgegeben. Ist keine Datei im angegebenen Ordner vorhanden, wird ein Bild dynamisch mit einem Warnhinweis generiert.

Es handelt sich um ein Skript von Matt Mulleneweg, welches von mir modifiziert und erweitert wurde.

3.Dateien hochladen

Jetzt noch die erstellten Dateien und die Bilder hochladen. Die index.html und rotate.php werden in das Rootverzeichnis geladen. Sollte das Skript nicht angepasst werden, müssen die Bilder ebenfalls im Rootverzeichnis liegen. Sind die Bilder zum Beispiel im Ordner images/introseite/, dann muss der Bildordner im Skript entsprechend definiert werden:

 $folder = 'images/introseite/'; 

Download - Dateien index.html und rotate.php

Zuletzt aktualisiert am Mittwoch, 14. März 2012 12:00

Copyright © 2005 - 2014 Kubik-Rubik.de - Viktor Vogel