Es kann mehrere Szenarien geben, bei denen die Ausgabe eines Zufallsbildes auf einer Website sinnvoll sein kann. Eine Möglichkeit für einen solchen Einsatz ist die 404er-Seite.

Unspektakuläre 404er-Seite

WordPress-Fehlerseiten sind in der Regel nicht besonders unterhaltsam und eigentlich sollte sie ja auch nie jemand zu Gesicht bekommen. Welche Möglichkeiten es gibt sie zu erstellen, habe ich ja schon vor einiger Zeit erläutert.

Dieses Mal möchte ich euch ein kleines Gimmick erläutern, mit dem ihr eine 404er Seite etwas interessanter gestalten könnt, jede andere Seite aber auch. 😉

Mit einem per Zufall angezeigten Bild kann das Design einer Seite interessanter und abwechslungsreicher gestaltet werden. Um das Zufallsbild auszuwählen, benötigt man zum Beispiel ein Javascript (via wordpress information).

<script type="text/javascript">
var imageURLs = [
"image1.jpg",
"image2.jpg",
"image4.jpg",
"image5.jpg"
];
function getImageTag() {
var img = '<img src=\"';
var randomIndex = Math.floor(Math.random() * imageURLs.length);
img += imageURLs[randomIndex];
img += '\" alt=\"404\"/>';
return img;
}
</script>

Dieses Skript kann man entweder in sein Childtheme einbinden oder aber, wenn es nur auf einer bestimmten Seite zur Verfügung stehen soll, du fügst es nur in die entsprechende Template-Datei ein. In unserem Fall wäre das die 404.php.

Im oberen Code musst du nur die Bildpfade anpassen, vielleicht ein Bild entfernen oder aber auch weitere hinzufügen. Außerdem ist es eventuell sinnvoll den alt-Tag anzupassen.

Nun muss man sich nur noch überlegen an welcher Stelle vom Theme eines der Bilder zufällig angezeigt werden soll. Dort gibst du dann den folgenden Code ein:

<script type="text/javascript">							
document.write(getImageTag()); </script>

Nun erscheint an der gewünschten Stelle nach dem Zufallsprinzip eines der im Skript hinterlegten Bilder.

Du kannst beide Code-Schnipsel auch in einem Widget veröffentlichen und hast dann so ein Zufallsbild in der Sidebar oder im Footer deiner Website.

Image(s) licensed by Ingram Image/adpic.

Diesen Blogartikel teilen:

Verwandte Beiträge:

Divi: Premium-Theme für WordPress
Werbung

Geschrieben von Thordis

Thordis Bonfranchi-Simović arbeitet seit Januar 2004 mit WordPress.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.