geBILDet

Artikel-Schlagworte: „WP-Theme“

Plug-Ins, diese sehr sehr nützlichen kleinen Dinger. Für die Seitenleiste werden die kleinen Zusatzprogramme auch Widgets genannt. (Letztlich sind sie nicht sehr viel anders, von der Funktion her sind es auch relativ kleine Code-Abschnitte, die halt bequem und GAI*-sicher in der Seitenleiste untergebracht werden; dafür muss nicht extra im Quelltext des Themes herumgepult werden. Schließlich ist Pulen im Code nicht jedermanns Sache.)
Einige Plugins haben eigene Widgets an Bord, um etwas in der Seitenleiste ausgeben zu können. Dazu ein Beispiel: Das Plugin “StatPress” erfasst unter anderem, welche Seiten wie oft besucht wurden. Über ein Widget in der Seitenleiste kann der bloggende Mensch dann beispielsweise diese Ergebnisse veröffentlichen. Ein weiteres Beispiel: Akismet (siehe unten) filtert Spam-Kommentare heraus — in einem Widget kann dann die Anzahl des gefilterten Spams bekannt gegeben werden.

Plugins oder Widgets machen das Leben eines Bloggers mit WordPress erheblich leichter. Der Funktionsumfang des Blogs wird (je nach gewählten Plugins teilweise oder ganz erheblich) erweitert. Viele dieser Add-Ons funktionieren “out of the box”, wie der Franzose sagt, also “direkt aus der Kiste”. Bei einigen muss ein wenig Hand angelegt werden, aber die Urheber solcher Schnippsel geben darüber meist recht detailliert Auskunft.

Es gibt viele Blogger, die ihre Erfahrungen mit Plugins und Widgets gerne weitergeben. Hier mal ein paar Beispiele, quasi als Inspiration und Warm-Up:

• Top Ten WordPress-Plugins 2008 (bei Oberlehrer)
• Wichtige Plugins (bei Cindy auf der Blogwiese)
• Die beliebtesten WordPress-Plugins in der deutschsprachigen Blogosphäre (bei Software Guide)

Nicht alles, was existiert, ist für jeden Blog gleichermaßen geeignet. Weder erhebe ich Ansprüche auf Unfehlbarkeit, noch schwelge ich in Absolutheitsphantasien. Ich blogge jetzt ein Vierteljahr mit WordPress (vorher habe ich mit BetaBlogger gearbeitet). Ich bin noch immer begeistert von den Möglichkeiten dieser Plattform. Und nachdem ich endlich mein Theme “environment” so habe, wie ich mir das vorgestellt habe, geht es jetzt verstärkt ans Feintuning mit Plugins und Widgets**.

Was ich für unabdingbar erachte

Akismet:
Einer der effektivsten Spamfilter überhaupt. Hat hier schon reichlich Spam rausgefischt. Aber: Der rechtliche Rahmen des Einsatzes scheint in Deutschland unsicher zu sein. Das Problem: Es werden, damit die guten Kommentare ins Töpfchen kommen, die schlechten aber ins Spam-Nirvana geschickt werden können, Daten an einen Server in den USA geschickt. Dieser gleicht bestimmte Parameter ab, speichert diese, aber der Akismet-Benutzer hat darauf keinen Einfluss und weiß auch nicht genau, was wie lange warum gespeichert wird. (Details bei Datenwachschutzblog.) Aus meine rErfahrung mit dem Plugin kann ich aber sagen, dass es sehr zuverlässig filtert und einem Kommentare wie diesen effektiv vom Hals hält. Bei allen rechtlichen Bedenken: Ich verwende ihn weiterhin, werde aber einen deutlichen Hinweis auf den Datenschutz setzen.

All-in-one-SEO Pack:
SEO — das Kürzel steht für Search Engine Optimization, also Suchmaschinenoptimierung. Mal Hand aufs Herz: Wer etwas in seinem Blog veröffentlicht, möchte auch gelesen werden. (Wahlweise gehört oder gesehen, wenn es sich um Podcasts, Musik oder Bilder handelt.) Zwei Besucher am Tag machen den Blogger-Kohl nicht fett. Da hilft so ein Plugin, dass einem weitgehend die Arbeit abnimmt, schon echt weiter. Man kann aber, wenn gewünscht, gehörig an der Optimierungsschraube des Optimierungstools drehen. Wobei Kenntnisse der englischen Sprache dafür unabdingbar sind.

Exec-PHP:
PHP ist quasi der Motor aller dynamischen Webinhalte. Wie jeder, der lesen kann, unschwer wird erkennen können, besteht so ein WordPress-Theme zu einem Großteil aus .php-Dateien, flankiert von .css, also Cascading styling sheets, welches den Design-Ton angibt. Will man nun ein Fitzelchen PHP in Artikel und/oder die Seitenleiste einbauen, so wird man ohne Exec-PHP kläglich schietern scheitern: Da verweigert WordPress in der Standardversion jedwede Zusammenarbeit. Mit diesem Plugin aber ist das einfach: PHP-Code schnappen, einfügen — und schon läuft die Geschichte. Die einfachen kleinen Text-Widgets werden plötzlich zu mächtigen Werkzeugen.

Warnung bei installiertem ExecPHP im Kopf des Editors

Aber Vorsicht: WordPress hat ja auch diesen WYSIWYG***-Editor. Soll beim Schreiben helfen, die Struktur und das spätere Aussehen des Eintrags zu erfassen. Für PHP-Code jedoch ist dieser Editor sehr gefährlich. Aber sind wir mal ehrlich: Sah Ihr Artikel jemals nach der Veröffentlichung so aus wie im Editor? Nein? Na, dann brauchen wir ihn wohl auch nicht.
Er kann dem ungeübten Anwender sicherlich eine gewisse Hilfe sein, die ungefähre Struktur zu erfassen, aber er ist entbehrlich. Für dieses Plugin ist er sogar tödlich, zumindest für den PHP-Code. Der ist dann ratz, fatz weg, wenn man einen Artikel aus der WYSIWYG-Oberfläche (die bei WordPress “grafisch” heißt) heraus speichert. Ich habe aber die Erfahrung gemacht, dass man durchaus zwischenzeitlich mal in die grafische Ansicht wechseln kann, wenn man nur nicht vergisst, vor dem Speichern in den HTML-Editor zurückzukehren — manche Schaltflächen (zum Beispiel die für Unterstreichungen) gibt es im HTML-Editor nicht.

Das mit den fehlenden Schaltflächen kann man aber abstellen — mit dem Plugin AddQuicktag, mit welchem es im nächsten Teil weiter geht.

Ein abschließender persönlicher Dank geht an Cindy, dass sie mir beim Suchen geholfen hat: Auf die Idee, in der Suchmaske der blogwiese mal den Namen des Plugins, welches sie verwendet, ich suchte, aber immer nur in der falschen Version in die Finger bekam, einzugeben, bin ich mit meinem Brausekopf nicht gekommen.

* GAI = Größter anzunehmender Idiotenanwender.

** Widget wird, LEO folgend, übrigens mit “Dingsbums”, “Mätzchen” oder “Vorrichtung” übersetzt. Auch nicht aussagekräftiger als die englische Bezeichnung. Bezeichnenderweise war der erste (Unter-)Titel meines Blogs “kunstgriff bloggt fotos und andere mätzchen”. “Andere Mätzchen” hat sich bis heute auch als Kategorie-Synonym für “Verschiedenes” erhalten.

*** WYSIWYG: Steht für “What you see is what you get”. Frei übersetzt: Guckste schon beim Schreiben, wie’s später aussieht.

Auf meinem Smartphone nutze ich ihn schon lange, das leider nicht mehr funktionstüchtige Linux-Laptop hatte ihn auch, und nun ist er neben Firefox und dem IE auf meinem Rechner angekommen: Opera, Version 9.6.4. Eigentlich wollte ich nur die Funktionalität und die Anzeige der Seite hier testen, aber Opera ist eine echte Alternative.

Und da ich nun schon mal dabei war, schubste ich auch gleich Safari dazu. Sonst ja eher bei Macs zuhause, gibt es die neueste Version (4 beta) auch für das “Schmuddel-OS” Windows. Auch Safari macht nach den ersten Versuchen einen richtig guten Eindruck.

Hier noch mal ein Testvergleich des gestrigen Tests bei BrowserShots. Da gab es kaum Überraschungen. Hier mal ein zusammengestelltes Bild mit einigen Browsern im Vergleich.

Browservergleich geBILDet bei BrowserShots

Es gab kaum Überraschungen, wie schon gesagt, aber es gab welche.

Browservergleich geBILDet die Überraschungen

Leider zeigten die “Ausreißer”-Shots bis auf den ersten nicht das Verhalten der drei nebeneinander stehenden Fußleisten an. Es ist aber davon auszugehen, dass sie ähnlich ausgerissen sind wie das Design im Kopf- und Postbereich.

Sie kennen das vermutlich: Kaum haben Sie ein paar Designideen abseits des Üblichen umgesetzt, fragen Sie sich, ob das denn auch alle sehen können, was Sie da gebastelt haben. Am einfachsten wäre es, sich mindestens drei Rechner mit Windows, Linux und MacOS im Hause zu halten. Darauf testen Sie dann den *GRMPF* Internet Explorer, Firefox, Safari, Opera… Fakultativ können Sie auch Ihren gesamten Freundeskreis aktivieren, Rundmails verfassen oder SMSen oder (ganz retro) anrufen, und dort dann die Frage an den Mann oder die Frau bringen: “Sach’ ma’, wie sieht eigentlich mein neues Seitendesign bei dir auf’m Rechner aus?”

Klar, können Sie alles machen. Oder Sie navigieren mal zu Browser Shots. Da können Sie die Browser-Kompatibilität Ihres Werkes ausgiebig testen. Aber Achtung: Fordern Sie nicht gleich von allen verfügbaren Browsern Screenshots an — das kann dann etwas länger dauern. Verschiedenen Systemen wird die zu testende Seite übermittelt, welche dann einen Screenshot tätigen, den Sie auch als ZIP-Datei herunterladen können. Ich habe es gleich mal mit 59 Browsern probiert, die Ergebnisse kommen dann häppchenweise. Die ZIP-Datei wird relativ groß, aber man bekommt durch diesen Open Source-Dienst einen guten Eindruck. Es lohnt sich übrigens, bei einer größeren “Bestellung” zu warten und gegebenfalls den “Verlängern”-Knopf zu drücken. So können Sie die angeforderten Browser-Shots wirklich komplett mitnehmen.
Ergänzung: Während ich diesen Eintrag verfasst habe, sind 49 der 59 angeforderten “Bildchen” eingetrudelt.

Bei BrowserPool bekommt man noch mehr — nämlich die Möglichkeit, die Funktionalität zu testen. Allerdings ist das auch nicht kostenlos, sondern liegt bei knapp 30 Euro pro Monat. Immerhin kann man einen kostenfreien Testaccount anlegen. Ein entsprechender Test steht noch aus.

Ja, endlich, hier läuft es ja schon seit einigen Wochen, wurde aber immer nachgebessert (oder verschlimmbessert, wie man’s sieht). Nun habe ich mich zur Veröffentlichung entschlossen! Natürlich wird da und dort noch geschraubt, aber auch die letzten Probleme sind behoben, diese Version läuft unter WordPress 2.7.1 stabil und gut.

Da ich den Grundstock als GNU-lizensiertes Werk ebenfalls frei bekommen habe, gebe ich die modifizierte und erweiterte Version gerne weiter.

Das Theme hier steht jetzt zum Download als ZIP-Datei bereit!

Zwangsläufig beschäftigt man sich mit Visualisierungsaspekten, wenn man ein Blog zusammenschraubt und fährt. Schließlich kann man nicht erwarten, dass sich alle so auf der Plattform auskennen wie man selbst. Gerade die Möglichkeit, RSS-Feeds zu abonnieren, kann nicht deutlich genung herausgestellt werden. Sonst rauschen alle Besucher wieder ab, ohne etwas für später mitzunehmen.

Eine ganz hervorragende Sammlung frei erhältlicher RSS-Piktogramme finden Sie hier — von ganz unprätentiös bis krachend. Wer von da wieder verschwindet, ohne fündig geworden zu sein, na, dem ist dann wohl nicht mehr zu helfen.

Es ist Ihnen vielleicht schon da und dort aufgefallen: Nicht nur der Blog-Titel ist anklickbar, sondern auch die Beschreibung. Sie können diesen Bereich auch Untertitel nennen. Sie als Besucher haben dadurch keine wirkliche zusätzliche Funktionalität — Sie gelangen von dort ebenso zur Startseite, als würden Sie auf den Blogtitel klicken. Der Blogger, zumindest dann, wenn er angemeldet ist, gelangt von dort aus jedoch direkt in den Admin-Bereich. Vielleicht ist dieses Gimmick ja für Sie interessant — um zum Dashboard zu gelangen, müssen Sie sich dann nicht mehr bis zum Admin-Link durchhangeln, denn die Blogbeschreibung steht ja ganz oben im Seitenkopf und ist somit stets schnell erreichbar. Wir hatten das hier auch eine Zeit lang, bis Blogtitel und -Beschreibung dem neuen Design weichen mussten, für das wir die Einblendung von Titel und Beschreibung abgeschafft haben.

Gut daran ist, dass dies mit sehr wenig Code zu realisieren ist. Der Ort, an dem sich das abspielt, ist die header.php. Sie suchen einfach <?php bloginfo('name'); ?> sowie <?php bloginfo('description');?>. Den Bereich, der meistens so aussieht:

<!-- No.1: USUAL WAY. CLICK ON BLOG TITLE LETS YOU RETURN HOME WHILE THE DESCRIPTION IS JUST A DESCRIPTION NOT A CLICKABLE AREA. -->
<div id="header">
<div id="headerimg">
<h1><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
<div class="description"><?php bloginfo('description'); ?></div>
</div>
</div>
<!-- END of No.1 -->

ersetzen Sie einfach durch diesen:

<!-- No.2: THE FOLLOWING COMMENTED PART IMPLEMENTS DIRECT ACCESS TO ADMININSTRATION BY CLICKING ON THE BLOG DESCRIPTION WHILE ANYONE WHO IS NOT LOGGED IN RETURNS BACK HOME -->
<div id="header">
<div id="headerimg">
<h1><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
<div class="description">
<a href="<?php
if (current_user_can('level_10'))
echo get_settings('home').'/wp-admin/">';
else
echo get_settings('home').'/">';
bloginfo('description'); ?>
</a>
</div>
</div>
</div>
<!-- END of No.2 -->

Was macht der Code? Während in Variante 1, dem Standard-Header, Blogtitel und -beschreibung im Kopf angezeigt werden, aber nur der Titel anklickbar ist und den Benutzer zurück zur Startseite bringt (<a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a>), wird in Variante 2, die ebenfalls beides anzeigt, durch einen Klick auf die Beschreibung die Berechtigung des Benutzers abgefragt. current_user_can('level_10') ist die höchste Berechtigung, nämlich die des Administrators. Sitzt jener gerade vorm Rechner, ist angemeldet, sieht sich das eigene Blog an und möchte nun dringend in das Dashboard gelangen, so genügt ihm (oder ihr, klar) das Anklicken der Blogbeschreibung dafür. Benutzer, die nicht angemeldet sind und somit auch nicht über entsprechende Berechtigungen verfügen, werden stattdessen einfach zur Startseite gebeamt.

Theoretisch (und praktisch) ist diese Berechtigungsabfrage auch für andere Funktionen sinnvoll, die nur dem Administrator zur Verfügung stehen sollen. Das Spektrum der Berechtigungen reicht von 0 (der registrierte User) über 1 (der Mitarbeiter), 2 (der Blogautor) und 7 (der Herausgeber) bis eben 10 (der Administrator). Natürlich sind die vergebenen Berechtigungen abwärtskompatibel: Ein Admin darf alles (Level 10 bis 0), der Herausgeber ist da schon eingeschränkter (Level 7 bis 0) usw.

Gestern nacht habe ich die Statistiken ausgewertet (damit die endlich mal gelöscht werden können, wie ich es in den Datenschutzrichtlinien für dieses Blog versprochen habe). Etwas erschreckt habe ich feststellen müssen, dass ein Großteil der Leserinnen und Leser via Microsofts Internet Explorer reinkommt — und leider sehen die nicht alles so, wie ich es gedacht habe. Es sind nur Kleinigkeiten, das Gesamt-Layout der Seite geht soweit in Ordnung. Trotzdem finde ich es nach wie vor ärgerlich, für jedes Hölzchen ein Stöckchen basteln zu müssen.

Gedacht ist der Kopfbereich so, wie ihn Firefox darstellt:

Post-Header in Firefox

Der Internet Explorer, bei mir immerhin die neueste Version, zeigt die Geschichte leider so an (unerwünschte Abweichungen sind markiert):

Post-Header im IE 7

In der Navigationsbox unter dem Artikel in der Einzelansicht gibt es auch einen Fehler. So wurde es programmiert:

Post-Box in Firefox

So zeigt es der Internet Explorer des führenden OS an:

Post-Box im IE

Nicht dramatisch, da gibt es ganz andere Katastrophen, aber mithin ärgerlich.

Nachtrag: Seit 19.März 2009 ist der nigelnagelneue Internet Explorer 8 erhältlich. Natürlich habe ich ihn sofort installiert, schließlich soll er wesentlich sicherer und kompatibler sein als die Vorgänger. Tatsächlich ist die zuvor verschobene Header-Anzeige nun korrekt, aber der zusätzliche Punkt in der Box bleibt.