Wie mache ich ein Theme für bbPress?

An den Suchbegriffen, die auf diese kleine Website führen, kann ich erkennen, dass relativ häufig nach Themes für bbPress gesucht wird. Das verfügbare Angebot an fertigen Themes ist zurzeit „sehr überschaubar“, um es einmal fröhlich positiv auszudrücken. Für jemanden, der mit wenig Mühe und ohne besondere Kenntnisse in der Programmierung und Gestaltung von Websites ein Forum aufsetzen möchte, das auch seinen optischen Anforderungen entspricht, ist dies sehr nachteilhaft und schafft eine hohe Einstiegshürde. Auch gibt es noch kein zentrales Theme-Verzeichnis, das einen bequemen optischen Vergleich und gezielten Download bestehender Themes ermöglicht, die dann mit geringer Mühe an die eigenen Bedürfnisse angepasst werden könnten.

Darüber hinaus gibt es kaum deutschsprachige Anleitungen, wie man selbst ein Theme gestalten kann, was für Einsteiger ebenfalls entmutigend ist. Die meisten Menschen wissen mit ihrer Lebenszeit etwas besseres anzufangen, als sich mühsam aus einer Vielzahl von Quellen die gewünschten Informationen zusammenzusuchen. Diese Situation wird noch ungünstiger dadurch, dass die für Theme-Designer verfügbaren Funktionen nirgends zentral und gut durchsuchbar und navigierbar dokumentiert sind, nicht einmal in englischer Sprache.

Ich kann nur hoffen, dass sich diese Situation in der nächsten Zeit ändert – und bis dahin einen eigenen kleinen Beitrag zur Verbesserung leisten.

Die folgende Kurzanleitung zur Erstellung eines bbPress-Themes richtet sich an Menschen, die

  1. bereits gewisse Kenntnisse in HTML, CSS und den Grundlagen der Gestaltung einer Website haben;
  2. die bereit sind, sich ihr Theme selbst zu bauen, aber keine Lust haben, dafür das Rad zum zweiten Male zu erfinden; und
  3. die eine gewisse Freude daran haben, sich ihr Wissen selbst zu erarbeiten, denn diese Freude macht es leichter, mit der gegenwärtigen, unbefriedigenden Situation zu leben.

Darüber hinaus sind grundlegende Kenntnisse in PHP sehr hilfreich, wenn sie auch für eine einfache Anpassung des Standard-Themes nicht unbedingt erforderlich sind. Mit Hilfe dieser Kenntnisse ist es möglich, den Aufbau des Standard-Themes Kakumei zu verstehen und eventuell gewünschte, tiefer gehende Anpassungen vorzunehmen. Wer darüber hinaus Erfahrungen darin hat, wie ein Theme für WordPress gestaltet wird, erhält einen besonders einfachen Einstieg, weil auf diesem Hintergrunde vieles in bbPress sehr vertraut wirkt.

Grundsätzliches

Alle folgenden Aussagen beziehen sich auf die gegenwärtige Version 1.0.x von bbPress. Die Konzepte sind allerdings so reif und gut, dass davon auszugehen ist, dass sie längerfristig Bestand haben werden.

Das Kernsystem von bbPress unterscheidet – im Gegensatz zu WordPress – sauber zwischen Standardthemes, die zur jeweiligen Release gehören und benutzerdefinierten Themes. Für jemanden, der von WordPress kommt, ist dieser Ansatz zunächst ungewohnt. Es gibt einerseits das Verzeichnis bb-templates, in welchem die Standardthemes untergebracht sind, und zum anderen das Verzeichnis my-templates, welches für die lokale Installation von weiteren Themes vorgesehen ist.

Vollständiger Aufbau eines Themes

Ein Blick in das Verzeichnis bb-templates/kakumei gibt am Beispiel des Standard-Themes Kakumei einen ersten Einblick darin, wie ein Theme aufgebaut ist. Für jedes Element in der Darstellung der Foren-Site existiert dort eine PHP-Datei. Jede dieser Dateien trägt einen (festgelegten) Dateinamen, der auch ihre Funktion deutlich macht. Die Datei header.php erzeugt etwa den Bereich der Foren-Site, der immer vor den jeweiligen Inhalten der dargestellten Seite angezeigt wird und der in einem eigenen Design in der Regel für eine Kopfzeile mit einer kurzen Beschreibung des Forums und eventuellen, statischen Navigationselementen verwendet werden wird. Die Datei footer.php erzeugt hingegen jenen Bereich der Foren-Site, der immer nach den Inhalten der dargestellten Seite angezeigt wird, hier wäre in einem eigenen Design etwa ein guter Platz für solche gesetzlich vorgegebenen Elemente wie ein Impressum oder eine Datenschutzerklärung.

(An ein Impressum oder eine Datenschutzerklärung sollte immer gedacht werden, wenn es sich um ein kommerziell betriebenes Forum handelt. Ein Website wird in der BR Deutschland auch dann als kommerziell betrachtet, wenn sie Einnahmen über eingeblendete Werbung erzielt, selbst wenn diese Einnahmen eher geringwertig sind. Das Fehlen solcher Angaben kann zur Begründung einer Abmahnung werden.)

Wer sich schon einmal mit dem Aufbau eines individuellen WordPress-Themes befasst hat, wird auf der Stelle ein Gefühl von Vertrautheit entwickeln. In der Tat haben WordPress und bbPress, so verschieden die Systeme auch sein mögen, etliche Gemeinsamkeiten, sowohl in den (bei WordPress gar nicht unumstrittenen) Konzepten als auch im Code des Kernsystemes. Im Gegensatz zu einem Blog hat eine Foren-Site jedoch relativ viele mögliche Ansichten für ihre Leser und Anwender, etwa das Profil eines Users mit Bearbeitungsmöglichkeit und persönlichen Favoriten, die Themen eines Forums, die Themen zu einem Schlagwort, die Liste der Schlagwörter, die Beiträge zu einem Thema, Suchergebnisse und die Darstellung einer Übersicht auf der Eingangsseite, um nur einmal die wichtigsten zu nennen. Da die Darstellung jeder dieser Ansichten angepasst werden kann, gehört zu einem Theme eine zunächst verwirrende Vielzahl von PHP-Dateien für die Darstellung. Da ich eine kurze Anleitung geben möchte (vielleicht schreibe ich später einmal eine ausführliche), gebe ich hier keine vollständige Liste der Dateien und ihrer Funktion an.

Besonders erwähnenswert ist die Datei style.css. Sie enthält die CSS-Anweisungen für die Darstellung der Foren-Site im Browser und somit den wohl wichtigsten Teil des gesamten Designs. Auch dieses Konzept ist WordPress übernommen worden.

Schauen sie sich ruhig einmal die style.css des Themes Kakumei an, um einen Eindruck zu bekommen! Sie benötigen dafür nur einen guten Editor. (Wenn sie unter Microsoft Windows arbeiten, kann es sinnvoll sein, die Datei nicht im Windows-Editor Notepad zu öffnen, da dieser Editor auch 25 Jahre nach seiner ersten Veröffentlichung noch nicht mit den Zeilenumbrüchen unixoider Systeme klarkommt und damit für viele Aufgaben schlicht unbrauchbar ist. Wenn sie zurzeit keinen anderen Editor zur Verfügung haben, können sie für einen ersten Einblick WordPad verwenden; auch Microsoft Word ist geeignet. Sie sollten sich aber zum Bearbeiten solcher Dateien einen guten Texteditor besorgen, dessen Bedienung ihnen zusagt – eine Vielzahl von Editoren mit teils riesigem Funktionsumfang steht als Freeware zur Verfügung.)

In den ersten Zeilen befindet sich als spezieller CSS-Kommentar eine Beschreibung des Themes in einem leicht verständlichen Format: sein Name, sein Autor, die Versionsnummer und weitere Angaben. Dieser Teil wird in der bbPress-Administration bei der Auswahl eines Themes angezeigt, er identifiziert das Theme aus Benutzersicht. Das in der bbPress-Administration angezeigte Bild vom Theme ist die Datei screenshot.png.

Der leichte Weg

Nachdem sie am Beispiel des Standardthemes Kakumei einen ersten, vielleicht etwas einschüchternden Eindruck von der Gestaltung eines Themes erhalten haben, schauen sie sich doch einmal das Verzeichnis kakumei-blue mit der Definition des zweiten Standardthemes von bbPress, Kakumei Blue, an!

Sie stellen fest, dass dieses Verzeichnis sehr „aufgeräumt“ aussieht. Statt einer verwirrenden Vielzahl von Dateien finden sie nur eine style.css und ein Bild screenshot.png, desweiteren noch ein Unterverzeichnis mit einem anderen bbPress-Logo.

An dieser Stelle sind sie zum ersten Male einer sehr angenehmen Eigenschaft von bbPress begegnet. Wenn in einem Theme keine spezielle Darstellung für einen bestimmten Bereich der Foren-Site spezifiziert wurde, dann wird immer die entsprechende Darstellung aus dem Standard-Theme Kakumei verwendet.

Wenn also nur die verwendeten Zeichensätze, das Farbschema, die Positionierung einzelner Elemente oder etwas Vergleichbares vom Standard-Theme Kakumei abweichen soll, die grundlegende Darstellung aber beibehalten werden soll, denn ist die Erstellung eines Themes sehr einfach und erfordert neben einer Anpassung der CSS-Definitionen keine weitere Programmierung. Allein über diesen Mechanismus sind weitgehende Anpassungen des Erscheinungsbildes möglich, zum Beispiel könnte ein Hintergrundbild für die gesamte Foren-Site oder für einzelne Elemente gesetzt werden, Elemente könnten transparent gestaltet werden… und vieles mehr.

Und diese sehr angenehme Eigenschaft von bbPress gilt auch für jedes benutzerdefinierte Theme. In vielen Fällen ist also ein Großteil der erforderlichen Arbeit schon erledigt, und sie können sich beim Design ihres Forums auf das Wesentliche konzentrieren, nämlich auf das Design.

Der Weg zum eigenen Theme

Aller Anfang ist leicht. ;-)

Im Verzeichnis ihrer bbPress-Installation sollte bereits ein Unterverzeichnis mit dem Namen my-templates existieren. Etliche ältere Versionen haben dieses Verzeichnis bei der Installation nicht automatisch angelegt, und in der Installation von bbPress 1.0 hatte es nach der Installation falsche Zugriffsrechte. (Dieser ärgerliche Fehler ist in neueren Versionen korrigiert.) Wenn das Verzeichnis noch nicht existiert, legen sie es an, und auch, wenn es schon existieren sollte, überprüfen sie bitte, ob es die richtigen Zugriffsrechte hat, damit das Benutzerkonto, mit dessen Rechten der Webserver läuft, lesend darauf zugreifen kann.

Legen sie im Verzeichnis my-templates ein Unterverzeichnis für ihr eigenes Theme an und geben sie diesem Verzeichnis einen Dateinamen (und die richtigen Zugriffsrechte), der aussagekräftig genug ist, damit sie auch einige Wochen später noch die Funktion dieses Verzeichnisses verstehen. Eine gute Faustregel ist es, dass der Dateiname einen Bezug zum Thema des Forums hat, vielleicht noch gefolgt von einer laufenden Nummer, falls sie häufiger Anpassungen an ihrem Theme vornehmen möchten, aber die alten (und im täglichen Betrieb bereits bewährten) Versionen aufbewahren möchten, um im Notfall jederzeit darauf zurückgreifen zu können.

Kopieren sie in das Verzeichnis ihres Themes die Datei style.css aus dem Kakumei-Theme und öffnen sie diese Datei in ihrem bevorzugten Editor. Geben sie im Kopfbereich einen Namen und eine Versionsnummer für ihr entstehendes Theme an.

Nun sollten sie ihr Theme in der bbPress-Administration angezeigt bekommen und auswählen können. Sie haben jetzt ein eigenes Theme, dessen Darstellung sie beliebig an ihre Ansprüche anpassen können. Das ist allerdings der schwierigere, aber eben auch der kreative Anteil.

Ändern einzelner Anzeigeelemente

In der Regel wird ein anderer, individuell angepasster Kopfbereich für die eigene Foren-Site gewünscht werden. Sie können einfach die Datei header.php aus dem Kakumei-Theme in das Verzeichnis ihres Themes kopieren und wie gewünscht anpassen, und auf die gleiche Weise können sie auch die anderen Elemente verändern.

Da das Standard-Theme Kakumei recht gut entworfen ist und sich seine optische Gestaltung leicht über CSS beeinflussen lässt, wird der Umfang solcher Änderungen eher klein sein. Vielleicht möchten sie zur Benutzerregistrierung noch einen Hinweis auf die Nutzungsbedingungen und die Datenschutzerklärung ihres Forums geben, die Darstellung eines Benutzerprofiles etwas hübscher machen, die Elemente auf der Startseite anders anordnen oder eine andere Fußzeile haben. Alle diese Eingriffe sind verhältnismäßig einfach, sie kopieren die entsprechende Datei in ihr Theme-Verzeichnis und bearbeiten sie dort. Selbst ohne eine gute Dokumentation geht das leicht von der Hand.

Für den rein persönlichen Gebrauch ist auch nicht mehr erforderlich.

Feinschliff

Wenn sie sich dazu entscheiden sollten, ihr Theme auch anderen bbPress-Anwendern zum Download zur Verfügung zu stellen, sollten sie am Ende noch etwas Feinschliff machen, damit das Theme auch in der bbPress-Administration benutzerfreundlich präsentiert wird. Geben sie in der style.css eine Download-Seite für das Theme an, damit eventuelle spätere Veröffentlichungen von den Anwendern leicht gefunden werden können, und erstellen sie eine Datei screenshot.png, damit schon vor der Auswahl des Themes ein grober optischer Eindruck seiner Gestaltung in der bbPress-Administration verfügbar ist. Für die Größe des Screenshot-Bildes in Pixeln orientieren sie sich einfach am bestehenden Screenshot des Kakumei-Themes.

Es bleibt zu hoffen, dass bald schon ein gutes, zentrales Download-Angebot für bbPress-Themes zur Verfügung steht. Bis dahin bleibt uns nichts anderes als die „gute alte“ Verlinkung, um bestehende Themes bekannt zu machen. Wenn sie einen Hinweis auf ihr erstelltes Theme und den Download hier im Forum hinterlegen, wird es vielleicht ein bisschen besser gefunden. Aber hier bitte nur auf Angebote hinweisen, die frei verfügbar sind.

Deutsche Installationsanleitung

Ich habe mir die Mühe gemacht, eine deutschsprachige Anleitung für die einfache Installation eines bbPress-Forums zu schreiben. „Einfache Installation“ meint in diesem Zusammenhang, dass das recht komplexe Thema der WordPress-Integration nicht behandelt wird – es ist komplex genug für eine spätere, eigene Dokumentation. Dafür sind jedoch ein paar Gedanken zum oft ignorierten Thema der Sicherheit einer bbPress-Installation eingeflossen.

Das Ergebnis ist ein 18seitiges PDF, das wie üblich unter der sinngemäß anzuwendenden Allgemeinen Lizenz für freie Musik zur Verfügung gestellt wird.

Download-Link: Anleitung für die einfache bbPress-Installation