Archiv für Schlagwort: wpt

Einen zufälligen Beitrag in WordPress ausgeben

Für ein kleines Projekt ((Dazu die Tage mehr, man darf gespannt sein!)) brauche ich gerade eine etwas spezielle Variante des WordPress-Loops: Es soll beim Aufruf der Seite ein Beitrag aus der Datenbank nach dem Zufallsprinzip ausgegeben werden. Nachdem ich ein wenig rumprobiert hatte, habe ich dann aber auch Google befragt und bin direkt auf den inzwischen leider verschwundenen Beitrag WordPress: Random Posts Without a Plugin gestoßen. Der erklärt sehr genau, was ich möchte.

Um es kurz zu machen, statt des normalen Querys nimmt man folgende Abfrage:

<?php query_posts(array('orderby' => 'rand', 'category_name' => SomeCategoryName, 'showposts' => 1)); if (have_posts()) : while (have_posts()) : the_post(); ?>

Dazwischen wird dann ganz normal mit den üblichen Template-Tags der Beitrag zusammengebaut. Wenn man die Änderungen an einem bestehenden Theme vornimmt, muss man eigentlich gar nichts verändern. Der Loop wird dann mit den folgenden Zeilen beendet.

<?php endwhile; else: ?>
<?php _e('Es wurde kein passender Eintrag gefunden.'); ?>
<?php endif; ?>

Ich habe für meine Zwecke noch eine kleine Abwandlung vorgenommen und die Option 'category_name' => SomeCategoryName herausgenommen, so dass keine spezielle Kategorie berücksichtigt wird. Grundsätzlich könnte man dort aber auch eine spezielle Kategorie eintragen, der ein oder andere mag das vielleicht in seiner Sidebar benutzen.

Eine lokale WordPress-Testumgebung unter Mac OS X installieren

Hin und wieder mag es praktisch sein, wenn man erst einmal lokal ein paar Dinge ausprobieren kann, bevor man sie auf den großen Webserver loslässt. Da ist dann am Ende sowieso wieder alles kaputt und man ärgert sich. Mir geht es so mit WordPress-Themes. Die teste ich gerne erst einmal auf einer eigenen Installation, damit ich mir mein tolles Blog hier nicht versaue.

Eine Möglichkeit wäre es, das mit Mac OS X schon mitgelieferte, aber nicht aktivierte, PHP zu aktivieren und eine MySQL-Datenbank zu installieren. Ein Apache-Webserver hat jeder Benutzer unter Mac OS X sowieso immer dabei. Das ist grundsätzlich auch mal nicht schwer, aber da ich ein altes Spielkind bin besteht die Gefahr das ich mir da auch mal leicht irgend einen Mist einbaue und dann mit einem halb zerschossenen System da stehe. Da ziehe ich eine in sich geschlossene Lösung vor. Die kann man im Notfall auch einfach wegwerfen und schnell neu installieren. Wie man sich so etwas installiert, erkläre ich jetzt.

Den ganzen Beitrag lesen.

Howto: Das Kommentarfeld in WordPress dynamisch vergrößern lassen wie bei Facebook

Ein kleines Detail das an meinem Blogdings hier, das ich ziemlich gerne mag, ist das sich automatisch vergrößernde Kommentarfeld unter den Einträgen. Wie so oft ist das Einbauen dieses Features recht simpel.

Zuerst lädt man sich nämlich das Elastic Plugin für jQuery runter und dann direkt wieder hoch. Am besten in den Ordner des aktuell verwendeten WordPress-Themes. Anschließend muss man es im Kopfteil der Seite, also in der header.php laden lassen. Das geht mit folgender Code-Zeile, man sollte darauf achten das man das Plugin erst nach jQuery lädt.

<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/jquery.elastic.js"></script>

Anschließend muss man das Plugin noch auf ein Textfeld ansetzen. Bei WordPress hat das Kommentarfeld normalerweise die ID comment. Deshalb sieht die entsprechende Zeile Code so aus:

$(document).ready(function(){
	//Elastic textarea for comments
	$('#comment').elastic();
});

Die packt man dann ebenfalls in den head der Seite in ein script-Element. Oder man nutzt die von mir empfohlene Alternative: Wie glaub ich schon einmal erwähnt, habe ich solche Dinge in einer extra Datei namens functions.js ausgelagert.

Ausprobieren kann man die Funktionalität in jedem Kommentarfeld auf dieser Seite. Man muss nur genug tippen.

Lazy Load – Bilder beim Scrollen einer WordPress-Seite nachladen

Letztens fragte man mich, wie das mit dem langsamen Nachladen der Bilder auf meiner Seite funktioniert. „Ganz einfach!“ antwortete ich. „Da schreibe ich mal ein paar Zeilen zu.“ Here we go:

Um die Bilder nachzuladen nutze ich ein Plugin für das Javascript-Framework jQuery. Das Plugin hört auf den schönen Namen Lazy Load und gibt es schon eine ganze Weile. Ich wundere mich ein wenig, dass es jetzt erst in Mode kommt. Grundidee des Plugins ist es gar nicht, die Bilder schön einblenden zu lassen. Eigentlich geht es darum, die Ladegeschwindigkeit der Seite beim ersten Laden zu erhöhen. Dazu werden zuerst nur die sichtbaren Bilder geladen und die weiteren Bilder dann beim scrollen.

Um das Plugin zu installieren sind nur wenige Schritte notwendig: Davon ausgehend, dass man jQuery bereits eingebunden hat, lädt man sich das Plugin schnell von der Lazy Load-Seite runter und packt es in den Ordner des eigenen WordPress-Themes. Anschließend bindet man die neue Datei dann mit folgender Code-Zeile in den Kopf der Seite (also in das head-Element).

<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/lazyload.js"></script>

Nun muss dem Script nur noch gesagt werden, welche Bilder eigentlich mit dem Effekt nachgeladen werden sollen. Bei mir sollen das alle großen Bilder in den Beiträgen sein. Da ich sonst alle Bilder im Layout per CSS eingebunden habe, kann ich das Plugin einfach auf dem img-Tag ansetzen.

	//Fauler Bildlader
	if(!navigator.userAgent.toLowerCase().match('ipad')) {
		$("img").lazyload({effect : "fadeIn"});
	};

Nun mag man sich wundern, was das if soll. Ganz einfach: Mir war aufgefallen, dass das iPad leider nicht mit dem Javascript zurechtkommt und statt der nachzuladenden Bildern nur das Fehlersymbol angezeigt wurde. Mit der kleinen Abfrage wird das Problem umgangen.

Für meinen Bedarf war es das dann auch schon. Auf der Plugin-Seite werden die weiteren Optionen des Plugins ausführlichst erklärt.

Bildbeschriftung mit jQuery

Dafür das es gar nicht lange gedauert hat, ist das Ergebnis schon recht ansehnlich: Die Bilder in diesem unglaublich belanglosen Blog sind nun auch mit einer tollen Beschriftung versehen. Aber nur, wenn man mit der Maus darüber fährt.

Realisiert habe ich das mit Hilfe von ein wenig jQuery, HTML und CSS. Bevor nach dem Klick ein paar Code-Schnippsel kommen, hier ein Anwendungsbeispiel:

Die Beschriftung dieses Bildes lautet <em>Blaues Fahrrad</em>.<br>Und das alles, ohne beim Schreiben des Eintrages viel Aufwand zu haben.

Den ganzen Beitrag lesen.

Relative Zeitangaben in WordPress

Aktualisierung: Damit das alles mehr Sinn macht, habe ich noch ein „über“ in das erste if eingebaut.

Kleine Bastelei in der Mittagspause: Über den Kommentaren wird jetzt nicht mehr das Datum des Kommentars angezeigt, sondern wie lange er schon dort steht. Das finde ich sehr viel hübscher als die normale Zeitangabe.

Nur ein klein wenig musste ich rumsuchen, bis ich eine Lösung für WordPress gefunden hatte. Im Ninedays Blog erklärt Terri Ann wie es geht und was der PHP-Code genau macht.

Da ich schon sehr viel Wert darauf lege das hier alles auf deutsch ist, übersetzte ich die wenigen Texte schnell. Außerdem habe ich das Skript so angepasst, dass es statt vor 1 Minute nun vor einer Minute ausgibt. Dazu habe ich in jede if-Abfrage noch ein weiteres „if“ eingebaut, das die Zahl 1 durch einen Text ersetzt. Das sieht in meinen Augen besser aus. Den von mir verwendeten Code gibt es nach dem Klick.

Den ganzen Beitrag lesen.

Weg mit dem WordPress.com Stats-Smiley!

Wer ein WordPress-Blog betreibt und das Plugin „WordPress.com Stats“ (früher) oder heute „JetPack“ benutzt, wird ihn kennen: Den kleinen, nervigen Smiley irgendwo auf der Seite der vom Plugin eingebaut wird. Je nach Theme hängt der dann irgendwo im Layout rum und kann da schon mal recht störend sein. Schade eigentlich, denn das Plugin an sich ist schon ziemlich praktisch.

Der kluge Blogbetreiber wird den Smiley aber schnell los, dazu braucht es nur ein klein wenig CSS.
Man kopiere einfach folgenden Code in die CSS-Datei seines Themes:

/* Den WordPress.com-Stats-Smiley ausblenden */
#wpstats {
display: none;
visibility: hidden;
}

Schon ist das lästige Grinsegesicht verschwunden!

WordPress-Update: Problem bei Host Europe

Mit meinem Webhoster bin ich ja wirklich zufrieden. Host Europe ist jetzt nicht gerade der billigste Laden, aber meine Erfahrungen (gerade mit den Kundenservice) machen das schon bezahlt. Wir erinnern uns: Ich bin manchmal auch nicht so klug, wenn es um Updates geht.

Ein Problem hatte ich dann doch aber die ganze Zeit noch: Aus einem mir nicht erfindlichen Grund wollte diese tolle neue automatische Update-Funktion von WordPress nie funktionieren. Ein paar mal hatte ich schon (anscheinend was falsches) gegooglet. Vorhin bin ich dann auf die Lösung gestoßen.

Folgendermaßen sieht die Lösung aus: Wir fügen der wp-config.php einfach noch eine weitere Variable hinzu:

putenv('TMPDIR='.ini_get('upload_tmp_dir') );

…und schon läuft alles wie geschmiert. Vielen Dank an dieser Stelle von mir.