WordPress mit Custom-Post-Types erweitern

Seit Version 3.0 erlaubt WordPress das Anlegen eigener Inhaltstypen, sogenannter Custom-Post-Types. Wofür können diese eingesetzt werden?

Nachdem wir im ersten Artikel dieser kleinen Serie die Post-Types genauer angesehen haben, die mit WordPress zusammen ausgeliefert werden, wird es Zeit für den nächsten Schritt: das Hinzufügen eigener Post-Types.

Vorbereitungen

Zum Anlegen unseres Custom-Post-Types benötigen wir einige Zeilen PHP-Code. Diese lassen sich entweder in der functions.php-Datei eines Child-Themes oder in Form eines kleinen Plugins für unsere WordPress-Installation bereitstellen.
Die Plugin-Lösung ist definitiv zu bevorzugen, weil wir auf diesem Weg nicht nur Design und Funktion unserer Seite voneinander getrennt halten, sondern auch sicher stellen, dass unser Post-Type unbeeindruckt von Theme-Wechseln weiter seinen Dienst verrichten kann.

Den WordPress-Editor um einen eigenen Button erweitern

Die Erweiterung des Editors um eigene Buttons ist eine schöne und nutzerfreundliche Alternative zu Shortcodes oder dem Einfügen von Markup in der Textansicht.

Für die meisten gängigen Aktionen der Textverarbeitung stellt der TinyMCE-Editor in WordPress Buttons bereit. Es gibt aber Themes, die beispielsweise die Hervorhebung eines Textabschnittes durch festgelegtes HTML-Markup erlauben. Dieses Markup kann der Nutzer dann etwa über Shortcodes (keine gute Idee, da die Auflösung der Shortcodes nach einem Theme-Wechsel nicht mehr funktioniert) oder die Textansicht des Editors einfügen – eine schönere Lösung ist aber ein entsprechender Button im Editor.

Seit WordPress 4.8 gibt es eine JavaScript-API, um den TinyMCE-Editor zu verändern oder auch neue Instanzen nach Laden der Seite zu erstellen. Damit ist es relativ einfach, zusätzliche Buttons in den Editor einzufügen.

Schutz vor versehentlichen URL-Änderungen

Mit zwei einfachen Ergänzungen der wp-config.php-Datei lassen sich versehentliche Änderungen der WordPress-URLs wirksam unterbinden oder im Notfall wieder rückgängig machen.

In den vergangen Wochen sind mir mehrfach Fälle untergekommen, in denen WordPress-Nutzerinnen und -Nutzer versehentlich die URLs geändert haben, unter denen ihre WordPress-Installationen erreichbar sind.

Mit zwei Feldern unter Einstellungen / Allgemein lassen sich die Verzeichnisse unter denen WordPress-Backend und -Frontend erreichbar sein sollen, spielend einfach festlegen. Durch diese Optionen können wir aber auch wunderbar an dem Ast sägen, auf dem wir sitzen. Entspricht die neue Angabe nicht der Realität auf unserem Server, dann erleben wir beim nächsten Aufruf unserer Seite eine unschöne Überraschung.
Im Frontend werden Bilder, CSS- und JavaScript-Dateien nicht mehr richtig geladen, das Einloggen ins Backend führt zu Fehlern. Kurzum: die Option kann über das Backend nicht einfach wieder rückgängig gemacht werden.

Theme-CSS für den Druck vorbereiten

Ja, es gibt sie noch immer: Menschen die das Internet ausdrucken. Während wir diese Tatsache häufig einfach ignorieren, kann es sich doch lohnen, Webseiten auch für den Druck vorzubereiten.

Ja ich weiß, Print-CSS klingt nach etwas schrecklich veraltetem und viele moderne Websites (von dem meisten WordPress-Themes ganz zu schweigen) verzichten heute bewusst oder unbewusst auf ein gesondertes Styling. Tatsächlich gibt es aber einige Vorteile, die ein paar kleine Designoptimierungen für den Druck durchaus rechtfertigen.

Print-CSS?

Fangen wir ganz von vorne an. Wenn wir CSS schreiben, dann beschäftigt uns dieser Tage vor allem die Ausgabe auf Displays. CSS versteht sich jedoch auf verschiedenen sogernannte Media Types. Neben dem bereits erwähnten screen für Displays auch noch projection, speech, braille und eben print für den Druck. Wenn wir CSS für den Druck bereitstellen wollen, gibt es grundsätzlich zwei Möglichkeiten, dies zu tun

Farbkontraste mit PHP berechnen

Um die Lesbarkeit von Schrift auf einem farbigen Hintergrund zu gewährleisten, muss der Kontrast von Schrift- und Hintergrundfarbe ausreichend groß sein. Selbstverständlich gibt es eine PHP-Funktion für diese Aufgabe.

Der Anwendungsfall: Mit dem Customizer sollen die Farben eines WordPress-Themes angepasst werden können. Für einfache Link-Farben, Buttons und Akzente ist das weitgehend unproblematisch. Es genügt, eine einzelne Farbe festzulegen.
Wird dagegen die Hintergrundfarbe einer Fläche, auf der Text liegt, farblich angepasst, so ist das Resultat der Anpassung unter Umständen ein fast unlesbarer oder zumindest schwer lesbarer Text. Zum Beispiel schwarze Schrift auf dunkelgrauem Grund, oder hellgraue Schrift auf hellem Grund.
Das mag man im ersten Moment auf das fehlende gestalterische Feingefühl des Benutzers schieben. Aber nicht lesbare Texte sind ein großes Minus für die Barrierefreiheit einer Website.