Immer wieder werden aufwändige Plugins und Konstrukte in Themes hinterlegt, um das Einbinden eines Zufallsbildes zu realisieren. PHP stellt mit der Funktion rand() eine geeignete und simple Lösung für diese Anforderung bereit.
Im folgenden kurz und knapp die Lösungsstruktur.
Prinzipiell kann man natürlich die Bilder von jedem beliebigen Verzeichnis laden, im Beispiel sollen die Bilder im Order des aktuell verwendeten Themes liegen, im Unterordner images.
Im Anschluss eine kurze Erläuterung der Funktion rand().
Struktur im Theme-Ordner
+ images
|--- headerimg_1.png
|--- headerimg_2.png
|--- headerimg_3.png
|--- headerimg_4.png
|--- headerimg_5.png
PHP Anweisung
int rand ( [int $min, int $max] )
Liefert eine Pseudozufallszahl zwischen min und max (inklusive), oder zwischen 0 und RAND_MAX falls keine Parameter angegeben wurden. Wenn Sie z.B. einen Zufallswert zwischen 5 und 15 benötigen so wäre der Aufruf dafür rand(5, 15).
php.net
<?php echo( rand(1,5) ); ?>
Code für die Implementierung unter WordPress
Im Template des Themes, welches den das Zufallsbild enthalten soll, muss dann der nötige Codeschnipsel rein. Natürlich kann man dies auch ohne WordPress nutzen, nur dort ist es mir besonders aufgefallen und der folgende Beispielcode nutzt zur Integration des Pfades einen Template Tag. Damit wird die Implementierung unabhängig und das Theme kann weiterhin auf andere WP-Installationen transportiert werden.
<img src="<?php bloginfo('template_directory'); ?>/images/headerimg_<?php echo (rand(1,5)); ?>.png" alt="Alternativ-Text" />
Update
Anbei noch eine Lösung mit der ich Bilder aus meinem Photoblog hole. Vielleicht kann sie ja der eine oder andere nutzen. Die Lösung nutzt nur die Thumbnail-Bilder und bindet diese in die Zufallsausgabe ein.
<?php
$dir = $_SERVER['DOCUMENT_ROOT'] . "/photos/wp-content/uploads/";
if ( is_dir($dir) ) { ?>
<div class="headerimg">
<?php
if ($dh = opendir($dir)) {
while (($filename = readdir($dh)) !== false) {
$filestring = explode(".", $filename);
if ($filestring[1] == 'thumbnail') {
$files[] = $filestring[0] . '.' . $filestring[1] . '.' . $filestring[2];
}
}
closedir($dh);
}
$x = count($files);
$ausgabe1 = rand(0, $x-1);
$ausgabe2 = rand(0, $ausgabe1-1);
$ausgabe3 = rand(0, $ausgabe1-2);
$ausgabe4 = rand(0, $ausgabe1-3);
?>
<img src="<?php echo 'http://domain.de/' . $files[$ausgabe1]; ?>" alt="Headerimage1" width="128" height="85" />
<img src="<?php echo 'http://domain.de/' . $files[$ausgabe2]; ?>" alt="Headerimage2" width="128" height="85" />
<img src="<?php echo 'http://domain.de/' . $files[$ausgabe3]; ?>" alt="Headerimage3" width="128" height="85" />
<img src="<?php echo 'http://domain.de/' . $files[$ausgabe4]; ?>" alt="Headerimage4" width="128" height="85" />
</div>
<?php } ?>
Hallo Frank!
Danke für den Tipp. Erspart mir nen Plugin (randomheader).
Gruß
Nick
mit rand() kann man wirklich vielerlei anstellen - z.B. Zufallslinks, Zufallszitate, Zufallsbilder.
Das funktioniert auch im css: Gabis BLOGhäuschen: PHP-Code in der CSS-Datei
Auf diese Weise könnte man sogar ein ganzes Layout per Zufall immer wieder neu generieren - ob das sinnvoll ist, sei dahingestellt
Und wie "strickt" man es in die sidebar-widgets (widget.php) wo/wie (als Nicht-PHPler
) ein?
Die Lösung ist nicht für Widgets gedacht. Dazu muss man wesentlich mehr machen. Aber es gibt sicher ein Widget-Plugin, was diese Aufgabe erfüllt.
Oder man baut den Code direkt in die sidebar.php ein, aber ein wenig PHP sollte man können, oder zumindest lernen wollen.
Hi Frank, gutes Beispiel! Schön schlanker Code. Kleiner Wermutstropfen: Man muss halt in die PHP-Funktion rein wenn man neue Bilder hinzufügen möchte. Ein umfangreicheres Skript kann da (oder sollte) z.B. die Funktion bieten, dass alle Bilder in einem Ordner automatisch ausgelesen werden und eines per Zufall gewählt wird. Aber für Leute, die sich nicht vor PHP-Code erschrecken, ist das eine gute Alternative!
@Robert: dazu ist das zweite Beispiel, welches alle Dateien eines definierten Ordners ausliest. Das nutze ich bsp.weise im aktuellen Header des Blog. Dabei muss man dann die Bilder nicht nachpflegen.
@ Frank: Asche auf mein Haupt, typischer Fall von RTFS (Read This Fine Script)
Hatte es mir nicht so genau angeschaut. Noch eine kleine Anregung: Das Alt-Attribut der Bilder könnte man noch sinnvoll füllen, indem man den Dateinamen (der ja schon als Variable existiert) dafür verwendet. Rechts das ".jpg" kann man ja wegschneiden. Dazu muss der Name halt aussagekräftig gewählt werden.
Hallo Franke,
interessanter Beitrag.
Ich habe jedoch eine Frage...
Wie kann ich die jeweiligen Zufallsbilder einzeln verlinken?
Also, dass jedes Bild einen entsprechend Link hat. Keinen Zufallslink.
Grüße
der Ratlose
ratlos » mit der Lösung nicht machbar, da man keinen Bezug zur ID hat. Dazu müsste man weiter ausholen oder per Feed die Daten holen.
Einfach ein dickes Dankeschön für diese clevere Lösung.
Hi Frank,
das klingt nicht schlecht. Ich suche jedoch eine Lösung wie ich die Bilder auf einer Seite wechseln kann.
Also ich hätte gerne, dass auf der Startseite "Home" immer wieder ein anderes Bild kommt.
Funktioniert das mit der oben beschriebenen Methode auch....?
Lefdi
@Lefdi: Die Änderung in der obigen Version erscheint bei jedem Reload der Seite, nicht als Slideshow. Dazu ist JavaScript oder Flash nötig.
Hallo Frank, ich lese schon eine Weile mit, jetzt mein erster Kommentar und ein Dankeschön für die Idee hier, damit habe ich genau die Lösung gebastelt die ich gebraucht habe. Ich habe sowohl vom Beitrag als auch in der Blogroll verlinkt - ok?
grüße Aebby
Super Tipp, einfach und genial. Genau das was ich für meinen Blog gesucht hatte. Vielen Dank Grüße Thomas
einfacher gehts wirklich nicht, Danke für den Tipp.
Hallo Frank,
ich muss jetzt doch noch einmal nachfragen, da der Einbau bei mir nicht so richtig funktioniert.
Ich habe gesehen, dass deine Thumbnailbilder im Header alle den Zusatz ".thumbnail" haben, wobei meine Thumbnails in Deinem tollen Grey-Theme alle den Zusatz "-128x85" tragen. Ich denke mal, dass dies nicht ganz unentscheidend ist, für die Anzeige der Bilder auf einer anderen Seite.
Auch ist mir noch nicht ganz klar, welche Domain in Deinem Beispielscript eingetragen werden muss. Egal mit welcher URL ich es versuche, die Bilder werden einfach nicht angezeigt.
Kannst Du mir möglicherweise noch einen Tipp geben?
Vielen Dank vorab und schönen dritten Advent.
Gruß Stephan
@Stephan: beim Upload der Bilder werden ja nach WordPress-Version unterschiedliche Namen erzeugt. Aber anstatt thumbnail kann man ja auch den Wert 128x85 o.ä. nehmen.
Hallo Frank,
ich habe das gleiche Problem wie Stefan - die Bilder, die von WP 2.7 erzeugt werden, heißen bsp. xxx-150x150.jpg oder xxx-480x640.jpg. Leider bin ich nicht php-fit
und weiß nun nicht, wie ich den Code oben entsprechend anpasse. Vielleicht kannst du mir auf den richtigen Weg bringen? Danke!
LG Andrea
Hallo Frank,
vielen Dank für das sehr ausführliche und anschauliche Tutorial...und größten Respekt an dein Blog Template...das ist die User Experience, die man sich andernorts nur wünschen kann...
Ich habe nur noch eine kleine Frage...PHP funktioniert ja nur bei einem neuen Pageload...gibt es diese Funktion auch in JavaScript, sodass ich das Bild automatisch per window onload alle paar Sekunden neu laden lassen kann...bräuchte diese Funktion für meine Zitate und Sprüche Website...
wäre dir äußerst dankbar für ein kurzes Kommentar.
Ja, so was gibt es, aber ich habe dazu kein Beispiel; eine Suche im Netz hilft sicher.
Vielen Dank für das Lob.
danke für den Denkanstoß...es gab im Internet doch eine Fülle an Code Templates für derartige Funktionen...ich habe mich mal an diesem Code orientiert....http://www.free-solutions.de/js/dokument_bildertausch_zufall.html
Danke, das ist wirklich simpel, ich hab meine Headerrotation damit ersetzt, die war zuvor in zwei Dateien ausgelagert.