A list of all my WordPress Plugins

Mein erstes WordPress Plugin hab ich vor mehr als 14 Jahren veröffentlicht und über die Jahre sind eine ganze Menge, mehr oder weniger erfolgreiche, Plugins dazu gekommen… Zeit für eine Inventur 🙂

Viele der Plugins schreibe ich in erster Linie für mich selbst (eat your own dogfood), weshalb ich in den wenigesten Fällen über die Plugins spreche oder sie bewerbe. Das, in Verbindung mit meinen eher spärlichen Beschreibungen, sorgt oft für eher zweistellige, maximal dreistellige Download-Zahlen. Wo die Zahlen höher sind, habe ich das Plugin meistens von Anderen übernommen (um die Weiterentwicklung zu gewährleisten) oder ich bin einfach „nur“ Contributor.

Aber Schluss mit der falschen Bescheidenheit!

Selbst wenn ich die Plugins für mich baue, ist die Motivation natürlich größer, wenn sie auch von anderen benutzt werden. Also möchte ich euch hier ein paar meiner Plugins vorstellen.

ActivityPub

ActivityPub ist ein, vom W3C veröffentlichtes, offenes, dezentrales Protokoll für soziale Netzwerke.

The ActivityPub protocol is a decentralized social networking protocol based upon the [ActivityStreams] 2.0 data format. It provides a client to server API for creating, updating and deleting content, as well as a federated server to server API for delivering notifications and content.

https://www.w3.org/TR/activitypub/

Es ermöglicht das dezentrale kommunizieren über Text, Bild, Video und Audio über ein simples Inbox/Outbox Prinzip.

WebFinger Plugin

WebFinger ist kein fester Bestandteil von ActivityPub, wird aber von allen großen Netzwerken unterstützt und von Mastodon sogar verlangt. WebFinger ist eine Art Meta-Data System für alle möglichen URIs. Der gängige Identifier im Fediverse ist @username@domain.tld, das Plugin erlaubt aber auch die Author URL oder die Instant-Messaging Accounts eines Users, wenn diese unter der gleichen Domain erreichbar sind.

Mein Identifier ist Beispielsweise pfefferle@notiz.blog und die Meta-Daten können über folgenden API-Endpunkt abgerufen werden: https://notiz.blog/.well-known/webfinger?resource=acct%3Apfefferle%40notiz.blog

NodeInfo Plugin

NodeInfo (2) ist auch kein fester Bestandteil von ActivityPub, wird aber auch von den Meisten Netzwerken unterstützt. NodeInfo stellt, wie der Name schon sagt, Infos über einen „Node“ (Server) bereit. Dank NodeInfo gibt es eine ganze Reihe an Statistik-Seiten wie the-federation.info, die bei der Auswahl der richtigen Plattform bzw. des richtigen Servers helfen.

ActivityPub Plugin

Das eigentliche ActivityPub Plugin macht WordPress zu einem (kleinen) Teil des Fediverse. User von Mastodon, Pleroma, Friendi.ca oder Pixelfed können dem Blog „folgen“ und sehen ab dann alle neuen Blog-Posts in ihrer Timeline und können diese kommentieren. Das Plugin ist immernoch in einem frühen Stadium und bekommt sicherlich noch das ein oder andere Feature, im Fokus soll aber das Bloggen stehen. Wer ein vollwertiges, dezentrales, soziales Netzwerk möchte, sollte sich erstmal für eine der oben genannten Plattformen entscheiden.

IndieWeb

Das IndieWeb ist eine Grassroots Bewegung mit dem Ziel, die eigene Webseite als zentralen Kommunikations-Hub zu nutzen.

The IndieWeb is a community of individual personal websites, connected by simple standards, based on the principles of owning your domain, using it as your primary identity, to publish on your own site (optionally syndicate elsewhere), and own your data.

https://indieweb.org/IndieWeb

Mehr zum IndieWeb findet ihr hier oder unter dem Tag „indieweb“ hier im Blog.

IndieWeb Plugin

Das IndieWeb Plugin hat nahezu keine Funktionalität, es ist vielmehr eine Art Installer um die IndieWeb Plugins über eine zentrale Stelle verwalten zu können.

Es gibt immer wieder Kritik am Aufbau des Plugins, bzw. kommt immer wieder die Frage auf, warum das Plugin nicht einfach die komplette Funktionalität der einzelnen Plugins beinhaltet. Meine Antwort darauf: Das IndieWeb ist mehr eine Idee als eine Spezifikation und es gibt verschiedene Möglichkeiten diese Idee mit WordPress umzusetzen. Für einen Usecase gibt es also oft verschiedene Lösungen, die von verschiedenen Personen entwickelt werden. Ein IndieWeb Plugin im Stil von ActivityPub ist in meinen Augen nicht möglich. Ich lasse mich aber gerne eines besseren belehren 😉

Webmention Plugin

Webmentions sind eine moderne Alternative zu Pingbacks und Trackbacks. Im Gegensatz zu der eher unglücklichen Darstellung von Pingbacks ([...] super, wie war nochmal der kontext, oder [...]) versucht das IndieWeb (über Webmentions und Microformats), den Sinn und die Art einer Verlinkung heraus zu bekommen um die Reaktion dann als Like, Bookmark oder vollwertiges Kommentar anzuzeigen.

Das Webmention Plugin implementiert aktuell nur den Kommunikations-Teil, für das Interpretieren der Websemantiken benötigt ihr zusätzlich das „Semantic Linkbacks“ Plugin.

Mehr über Webmentions hier oder unter dem „webmention“ Tag hier im Blog.

Semantic Linkbacks Plugin

Wie oben beschrieben sorgt das Semantic Linkbacks Plugin für die hübsche Darstellung der Webmentions, Pingbacks und Trackbacks. Wir sind gerade dabei, die Funktionalität in das Webmention Plugin zu übertragen, deshalb hat das Plugin aber nur noch temporär Bedeutung.

WebSub Plugin

WebSub (formerly known as: PubSubHubbub) ist ein simples PubSub Protokoll für das Web. Es wurde ursprünglich entwickelt um updates von RSS und Atom Feeds in „echtzeit“ zu konsumieren. Push statt pull. Die Restriktion auf RSS und Atom, wurde mit der aktuellen Version aufgehoben.

WebSub provides a common mechanism for communication between publishers of any kind of Web content and their subscribers, based on HTTP web hooks. Subscription requests are relayed through hubs, which validate and verify the request. Hubs then distribute new and updated content to subscribers when it becomes available. WebSub was previously known as PubSubHubbub.

https://www.w3.org/TR/websub/

Über das WebSub Plugin (ursprünglich entwickelt von Josh Fraser) kann man die Standard-Feeds von WordPress abonnieren. Das Plugin kann aber auch über andere Plugins und Themes erweitert werden.

MF2 Feed Plugin

Das IndieWeb setzt im, Gegensatz zum Fediverse, nicht auf APIs, sondern auf Semantisches HTML:

The idea is rather than publishing something twice (repeating yourself) with (x)HTML for browsers and XML for aggregators – you simply publish once using (x)HTML and allow the tools to take care of the rest.

http://microformats.org/wiki/dry

In einer Welt in der jeder WordPress Theme Developer Wert auf Microformats, Schema.org oder Ähnliches achtet, funktioniert das Konzept super. Die Erfahrung zeigt aber, dass nur wenige Themes (seit fast 9 Jahren eigentlich sogar nur ein Theme) im WordPress.org Repo Microformats2 unterstützt.

Ich habe viel herum experimentiert um Themes über ein Plugin mit den nötigen Semantiken zu erweitern, was aber, durch Output Escaping, zu komischen Nebeneffekten geführt hat (das alles aber nur der Vollständigkeit halber, das Thema ist eigentlich einen ganzen Artikel wert).

Letztendlich haben wir für WordPress ein Plugin gebaut, das einen Feed bereit stellt, der genau dem JSON Format entspricht, welches auch die Microformats Parser ausspucken. Das Webmention Plugin sucht also erst den pre-parsed Feed und versucht erst im zweiten Schritt, die Seite selbst zu parsen.

Ihr versteht die Ironie? Microformats(2) sind geschaffen worden um XML/JSON APIs abzulösen und weil das bei WordPress nicht wirklich dolle funktioniert bieten wir die Infos als JSON API an! 😀

Decisions, not Options

Ich bin ein Freund von kleinen Plugins die nur einen spezifischen Anwendungsfall abdecken und im besten Fall auch vollkommen ohne Settings aus kommen. Frei nach dem Motto von WordPress:

When making decisions these are the users we consider first. A great example of this consideration is software options. Every time you give a user an option, you are asking them to make a decision. When a user doesn’t care or understand the option this ultimately leads to frustration.

https://wordpress.org/about/philosophy/#decisions

(Ironischerweise führt aber gerade das Fehlen von Settings oft für Verwirrung 😉 )

OpenGraph Plugin

Das Open Graph Protokoll wurde von Facebook entwickelt und hat einen ähnlichen Nutzen wie oEmbed:

The Open Graph protocol enables any web page to become a rich object in a social graph. For instance, this is used on Facebook to allow any web page to have the same functionality as any other object on Facebook.

https://ogp.me

Es wird aktuell von fast jedem großen Netzwerk oder fast jeder Messaging App benutzt und sorgt dafür, dass ihr die kleinen hübschen Vorschausnippets seht, wenn ihr einen Link mit euren Freunden teilt.

Das OpenGraph Plugin wurde ursprünglich von Will Norris geschrieben und generiert alle notwendigen Meta-Tag Header. Keine Settings, keine Entscheidungen, aber mit wohl definierten Filtern zum erweitern.

Hum Plugin

Hum generiert schöne, semantische Short-URLs für WordPress Posts und Pages. Das Plugin ist ursprünglich auch von Will Norris, integriert sich in die WordPress Core-Funktionen und kommt auch komplett ohne Settings aus.

Hum basiert auf Whistle

Whistle is an open source, algorithmically reversible, personal URL shortener.

http://tantek.pbworks.com/w/page/21743973/Whistle

…und New Base 60

A base 60 numbering system using only ASCII numbers and letters.
or
a side effect of building a personal URL shortener

http://tantek.pbworks.com/w/page/19402946/NewBase60

…zwei Specs von Tantek Çelik.

Open Search Document Plugin

Die OpenSearch Spezifikation bietet Möglichkeiten um die lokale Blog-Suche für Browser oder Suchmaschinen zugänglich zu machen.

OpenSearch is a collection of simple formats for the sharing of search results.

https://github.com/dewitt/opensearch

Es gibt Integrationen für alle bekannten Browser wie z.B. Chrome, Safari, Firefox und Microsoft Edge.

Das Plugin wurde ursprünglich von johnnoone Entwickelt, es stellt eine XML Beschreibung der Suche und einen Endpunkt für Such-Vorschläge basierend auf Tags bereit.

Das wars auch schon 🙂

Mehr?

Natürlich gibt es noch mehr, das würde aber den Rahmen sprengen. Ich nutze WordPress gerne um neue Specs und Ideen auszuprobieren und daraus entstehen meist kleine Plugins, die es oft nicht wert sind, auf WordPress.org veröffentlichen zu werden.

Ihr könnt aber gerne:

Ihr könnt fast alle Plugins auch bequem über Composer installieren und updaten.

Ich freue mich IMMER über Hilfe, also feel free to contribute!

Torsten Landsiedel hatte 2019 die Idee zum #Projekt26:

  • Alle zwei Wochenmuss“ ein Blogartikel geschrieben werden.
  • Alle zwei Wochen „muss“ ein anderer Blogartikel kommentiert werden – das ist neu, aber wichtig, damit wir den Blog wieder als zentralen Ort für den Austausch nutzen und das nicht auf den Social Media Plattformen diverser Konzerne machen.
  • Das Thema sollte WordPress sein, angrenzende Themengebiete, wie CSS, JavaScript, etc. gehen natürlich auch. Bonuspunkte gibt es für Artikel zum Thema Gutenberg.
  • Der Hashtag lautet #projekt26 und sollte selbstredend bei der Bewerbung der Artikel genutzt werden.
  • Am liebsten sind mir echte, originäre Artikel, keine Zweiverwertungen, Listen, Linktipps, etc. – Faustformel könnte die Mindestlänge der VG Wort sein (1800 Zeichen).

Ich mag den Fokus auf WordPress, auch wenn das ja hier eher nicht mein Haupt-Thema ist. Das gibt meinem Blog aber ein wenig Abwechslung und ich schaffe es vielleicht mal über die ganzen Plugins zu schreiben, die ich in den letzten Jahren so verbrochen habe… und da wären wir ja wieder beim Thema 😉

Neben dem regelmäßigen Bloggen, mag ich aber auch den Punkt mit dem Kommentieren. Was uns in den letzten Jahren immer mehr verloren gegangen ist, woran ironischerweise die SOZIALEN Netzwerke nicht ganz unschuldig sind, ist der Diskurs direkt im Blog. (Das ist übrigens mit einer der Gründe warum ich das Webmention und ActivityPub Plugin geschrieben habe.)

Da ich in den letzten Jahren hier eher weniger aktiv war, motiviert mich die Idee der selbstauferlegte Druck hoffentlich, in diesem Jahr regelmäßiger zu schreiben.

…und dass ich diesen Artikel statt in Kalenderwoche 1 oder 2, erst jetzt schreibe, bestärkt mich nur noch mehr in dieser Ansicht!

(zum Glück kann man Artikel zurück datieren 😀 )

(Ich weiß, ich weiß… ich bin etwas spät dran, aber immerhin schreibe ich schon seit dem 26. Mai an dem Post!)

Am 27.06. fand, im Rahmen des Karlsruher WordPress Meetups, eine kleine 15 Jahr feier statt. Lucas Radke (der leider keine eigene Webseite besitzt) hat zu diesem Anlass, die WordPress Highlights der letzte 15 Jahre präsentiert. Ich fand die Idee ganz scharmant und habe die letzten Wochen mal recherchiert wie meine WordPress Geschichte seit 2002 aussieht.

2002

Fast genau ein Jahr (29.05.2002) vor dem WordPress Fork hab ich das erste b2/cafelog (der Vorgänger von WordPress) Weblog aufgesetzt.

pfefferle.org in 2003

Damals hab ich die Entscheidung folgendermaßen begründet:

Durch einen unglücklichen Zufall kam ich an 50 mb Webspace (mit PHP und MySQL Datenbank) und die Domäne jsjsjsj.de (lange Geschichte). Wegen goßem Ideenmangel, viel Webspace und nachdem ich schon etwas PHP gelernt hatte beschloß ich einfach mal testweise ein phpNuke zu installieren…

Nachdem der Webspace nach einem Jahr auslief, ich die jsjsjsj.de Domäne endlich wieder los war und erkannte das ein Content Management System etwas zu überdimensional für eine Privatperson sei, habe ich mir so meine Gedanken gemacht, wie die neue Seite aussehen solle.. Irgendwann kam ich zufällig auf die Seite webfroot.co.nz und war begeistert von der Weblog Idee.

2003

Anders, als ich bisher angenommen habe, bin ich nicht 2003 auf WordPress umgestiegen, sondern erst ein Jahr später. Nichts desto trotz hab ich mich intensiv mit dem neuen Projekt beschäftigt, immerhin war die Zukunft von b2 damals nicht wirklich klar!

My logging software hasn’t been updated for months, and the main developer has disappeared, and I can only hope that he’s okay.

What to do? Well, Textpattern looks like everything I could ever want, but it doesn’t look like it’s going to be licensed under something politically I could agree with. Fortunately, b2/cafelog is GPL, which means that I could use the existing codebase to create a fork, integrating all the cool stuff that Michel would be working on right now if only he was around. The work would never be lost, as if I fell of the face of the planet a year from now, whatever code I made would be free to the world, and if someone else wanted to pick it up they could. I’ve decided that this the course of action I’d like to go in, now all I need is a name. What should it do? Well, it would be nice to have the flexibility of MovableType, the parsing of TextPattern, the hackability of b2, and the ease of setup of Blogger. Someday, right?

Matt Mullenweg: The Blogging Software Dilemma

2004

WordPress installiert!

2005

2005 hab ich mir die Domain notizblog.org registriert um ein neues WordPress Blog aufzusetzen.

notizBlog.org gibt es seit Mitte 2005 und ist mein privater Blog. Angefangen hat alles mit einem Blog auf pfefferle.org, daraus hat sich das Ettlinger Weblog “MadLog” entwickelt, welches recht schnell zu nem Gemeinschafts-Blog oder sowas in der Art geworden ist. Da ich aber in dem Bereich Neue Medien bzw. Online Medien studiere, dachte ich es sei nicht schlecht ein eigenes Weblog zum Testen und Ausprobieren zu besitzen.


Außerdem wollte ich natürlich ein Teil vom Web2.0 sein 😀

2006

Mein erster Versuch ein Theme zu bauen!

Mehr fällt mir dazu nicht ein 😉

2006 hab ich außerdem mein WordPress.org Profil angelegt um 2007 dann auch mein erstes Plugin zu veröffentlichen.

2007

Mein erstes WordPress Plugin war Simple-CoComments. Es war/ist so „komplex“, dass man problemlos den kompletten Quellcode hier veröffentlichen könnte 🙂

Mein erstes großes Projekt in 2007 war aber das APML Plugin, worüber ich (das erste Mal) auch ein wenig Aufmerksamkeit in gleich zwei Communities bekam: WordPress & DataPortability.

2008

2008 hatte ich einfach nur total bock aufs bloggen. Im Durchschnitt kam ich auf 0,7 Artikel pro Tag, das sind derzeit 37% aller bisherigen Artikel!

2009

2009 entstand das ActivityStreams Plugin für WordPress, was dann auch der Start zu den diversen OStatus Plugins und meiner arbeit an dem OStatus Plugin war.

2010

Im Februar 2010 kam Pepijn auf mich zu, ob ich ihn nicht bei der Entwicklung eines OStatus Plugins für WordPress unterstützen wolle…

Are you pfefferle on WordPress.org?

Together with a few other individuals I'm working on a distributed social network plugin for WordPress.
I've been following the social-discuss mailing list for a while, and it seems to me that OStatus is considered a good candidate for a protocol.

According to this page, OStatus is basically a collection of extensions to Atom.
http://status.net/wiki/OStatus

Since you are the author of both an Activity Streams plugin an a Portable Contacts plugin -- among a few other interesting and probably related plugins -- I would like to inform you about our efforts.

Maybe we could share some code, or even join forces?

Groeten,
Pepijn de Vos

Die Arbeit am OStatus-Plugin hat bisher am meisten Spaß gemacht! Von allen Plugins, ist es das einzige, das ohne große Änderungen immer noch funktioniert. Gerade vor ein paar Monaten hab ich den ganzen OStatus-Plugin-Stack für Mastodon nochmal auf den neusten Stand gebracht 😍

2011

Durch die Arbeit an OStatus, habe ich auch viel am PubSubHubbub Plugin mitgeholfen. Mittlerweile habe ich das Plugin mehr oder weniger übernommen, bzw. bin ich aktuell der einzige aktive Maintainer.

Das Besondere an dem Plugin sind die 100.000 Installationen, die es zu einem der Top 100 Plugins auf WordPress.org machen!

2012

Mein erstes ernstzunehmendes Theme: SemPress!

2013

Ein Jahr später hat es SemPress dann in das offizielle Theme Directory von WordPress.com geschafft!

2014

2014 habe ich das OStatus Plugin geklont und einen ersten Prototypen eines IndieWeb Plugins veröffentlicht. Das IndieWeb Plugin ist bis heute eine Art Installer, der User bei der Installation und Einrichtung der verschiedenen IndieWeb-Plugins unterstützen soll. Mittlerweile ist die IndieWeb WordPress Community gut gewachsen und seit letztem Jahr ist das Plugin Teil des offiziellen IndieWeb-Repos, in der Hoffnung, dass es dort mehr Pflege bekommt.

2015

Meine erste „Core Contribution“. Für WordPress 4.4 habe ich Pascal Birchler bei der Entwicklung des WordPress oEmbed Providers geholfen.

2016

Mein erstes WordCamp und mein erster Vortrag auf einem solchen. Thema war das IndieWeb… Was auch sonst 😉

Soziale Netzwerke haben meistens nur eine begrenzte Lebenszeit. Posterous wurde von Twitter gekauft und eingestellt, Google Buzz durch Google Plus ersetzt und MySpace hat seine Blogging-Plattform geschlossen. Alleine mit Geocities wurden 2009 knapp 23 Millionen Seiten unwiderruflich vom Netz genommen. Jeder dieser Schritte ist mit einem Datenverlust verbunden. Die IndieWeb Bewegung versucht diesem Trend entgegen zu wirken. Inhalte werden nur noch auf der eigenen Seite veröffentlicht und erst dann über die Socialen Netzwerke geteilt. Aber nicht nur Artikel, sondern auch Bilder, Videos und Kommentare. WordPress bietet ideale Voraussetzungen um sich unabhängig von den sozialen Medien zu machen und dennoch dessen Vorteile und Reichweite zu nutzen. Welche Möglichkeiten gibt es aktuell, um Inhalte automatisch zu teilen oder Reaktionen im Netz einzusammeln und wie lässt sich mit WordPress eine Art dezentrales Social Network bauen.

2017

Ich bin großer Fan von Gutenberg, DEM neuen Editor von WordPress, und arbeite seit 2017 daran, mein aktuelles Theme ZenPress möglichst kompatibel zu machen.

2018

2018 war ich das erste mal auf einem WordPress-Meetup und bei meinem ersten Hackathon zum Thema WordPress.

Es hat Spaß gemacht, die alten Sachen heraus zu kramen 🙂

Auf die nächsten 15 16 Jahre!

Ich durfte auf dem WordCamp Frankfurt etwas zum Thema IndieWordPress erzählen und seit ein paar Wochen kann man sich den Vortrag auch auf WordPress.tv anschauen. Der Ton ist am Anfang etwas schlecht, wird aber nach ca. 5 min besser! Für die Text-Bevorzuger… Im Vortrag geht es um folgendes:

Soziale Netzwerke haben meistens nur eine begrenzte Lebenszeit. Posterous wurde von Twitter gekauft und eingestellt, Google Buzz durch Google Plus ersetzt und MySpace hat seine Blogging-Plattform geschlossen. Alleine mit Geocities wurden 2009 knapp 23 Millionen Seiten unwiderruflich vom Netz genommen. Jeder dieser Schritte ist mit einem Datenverlust verbunden. Die IndieWeb Bewegung versucht diesem Trend entgegen zu wirken. Inhalte werden nur noch auf der eigenen Seite veröffentlicht und erst dann über die Socialen Netzwerke geteilt. Aber nicht nur Artikel, sondern auch Bilder, Videos und Kommentare. WordPress bietet ideale Voraussetzungen um sich unabhängig von den sozialen Medien zu machen und dennoch dessen Vorteile und Reichweite zu nutzen. Welche Möglichkeiten gibt es aktuell, um Inhalte automatisch zu teilen oder Reaktionen im Netz einzusammeln und wie lässt sich mit WordPress eine Art dezentrales Social Network bauen.

Nicole Lücking (photostroller) hat außerdem ganz tolle Scribbles zu dem Vortrag gemacht:

Eigentlich wollte ich ja nur einen Toolbox Fork erstellen und das Theme um Microdata/Schema.org erweitern und dann hat es doch so viel Spaß gemacht, dass ein eigenes Theme daraus wurde… Ich präsentiere euch SemPress, das hoch semantische HTML5 Theme mit ner Prise Responsiveness und SEO 🙂

Das Theme verschönert übrigens das notizBlog und ist aus folgenden Gründen großartig:

POSH – Plain Old Semantic HTML5

HTML5 Logo

SemPress basiert, wie schon erwähnt, auf Toolbox und die HTML5 Struktur wurde auch weitestgehend beibehalten. Ich habe lediglich einige Tags in (meiner Meinung nach) semantisch passendere getauscht. Im Detail:

  • Semantische Tags – Ich habe einfach mal geschaut welche Tags Toolbox noch nicht unterstützt und sie dann, hoffentlich richtig eingebaut :).
  • HTML5 Input-Types – SemPress unterstützt einige der neuen Input-Types wie z.B. „search“, „email“ und „url“. Mehr dazu in einem älteren Artikel.

Websemantics

Eigentlich hab ich das ganze Projekt (wie schon erwähnt) ja nur gestartet, damit ich mal wieder was produktives mit Microformats machen und Schema.org lernen kann. Hier also der Semantic Overload:

  • Microformats – Toolbox selbst unterstütz Microformats ja schon von Haus aus und ich musste nur kleine hAtom fixes und die richtigen Profile Header setzen.
  • Microformats v2 – Ich bin zwar kein großer Fan von Microformats 2, aber ich wollte testen wie leicht sich das Theme um neues HTML-Classes erweitern lässt und wie viel Arbeit es bedeutet. SemPress unterstützt hCard 2 und hAtom 2.
  • Microdata/Schema.org – Ähnlich wie bei Microformats v2 wollte ich testen wie schwer es ist, Schema.org einzubauen. Das Theme unterstützt http://schema.org/Blog, http://schema.org/BlogPosting and http://schema.org/Person.

Was ich noch gerne einbauen will ist hMedia für alle möglichen Medieninhalte wie z.B. auch WordPress „Images“ und „Galleries“ und natürlich auch das Schema.org Pendant.

WordPress Features

Neben dem ganzen semantik Gedöns, hab ich natürlich auch ne Menge WordPress-Features eingebaut.

  • Post Thumbnails – SemPress unterstützt diverse Post-Thumbnail Größen (maximal 600px) und versucht sie bestmöglich darzustellen. Alle Bilder kleiner als 480px werden z.B. mit float right in den Text integriert.
  • Post Types – Im Gegensatz zu Toolbox unterstützt SemPress folgende Post-Types: „aside, status, gallery, video, audio, link, image“ und fast alle haben auch ein individuelles Layout spendiert bekommen.
  • …außerdem: Localization, Sidebar-Widgets und die WordPress‘ Navigation Menu.

Mal schauen ob ich noch ein Custom-Header-Image mit rein nehmen werde…

CSS und Design

Zuerst sollte SemPress gar kein Design bekommen, aber man muss ja auch bei CSS und Fonts auf dem Laufenden bleiben! Ich mach das ja schließlich nicht zum Spaß sondern zur Fortbildung :). Da ich aber kein wirklich großer Designer bin, hab ich mir ne Menge Ideen und CSS bei folgenden großartigen Projekten ausgeliehen:

  • Das Basis-CSS hab‘ ich von Toolbox übernommen.
  • Die Tabellen, Buttons, Input-Felder, Code-Boxen habe ich mir bei Twitters Bootstrap gemopst.
  • Die Icons, die vor einigen Artikeln erscheinen (z.B. die vom Typ Video oder Audio) sind von von Font Awesome.
  • Danke auch an HTML5 Boilerplate für einige Ideen!

Ein paar weitere Kleinigkeiten (auf die ich auch bissle Stolz bin):

  • Man kann den bei dem <code />-Tag die Programmiersprache mir data-programming-language="PHP" setzen und es wird wie folgend angezeigt: <?php echo "Hallo Welt"; ?>
  • Das Theme kommt komplett ohne Bilder aus.

Responsive Design

Das Theme sollte eigentlich und hoffentlich auf jedem Gerät gut aussehen und unterstützt drei++ Breiten:

  • Volle Breite + Sidebar rechts
  • Volle Breite + Zweispaltige Sidebar am Ende der Seite
  • Variable Breite (die, für das Gerät beste Breite mit einem) + Einspaltige Sidebar am Ende der Seite.

Außerdem passt sich das Menü automatisch an die Größen an und das ganz ohne JavaScript! …beim Drop-Down Menü gibt es zwar noch keine Möglichkeit das Menü wieder zu schließen, aber wer will das schon 😉

Was jetzt noch?

Da mir das themen ne Menge Spaß gemacht hat werde ich wohl auch weiterhin fleißig an SemPress weiter basteln und es noch semantischer und WordPressiger machen. Falls ihr irgendwelche Fehler findet oder Dinge besser könnt wie ich… bitte helft mir und forkt SemPress!

HTML5 Logo

Dass HTML5 ein paar neue input-types definiert, habe ich durch die hcard-input-brainstorming so am Rande auf geschnappt, mir aber nichts weiter dabei gedacht… Durch Zufall bin ich heute aber über folgenden Tweet von Sylvia Egger gestoßen:

Just implemented native #HTML5 form validation on #wp comments form – it' quite simple & should be in #wp default theme

und habe bissle recherchiert… Mit den neuen Input-Types ist es doch tatsächlich möglich Input-Felder über den Browser validieren zu lassen… Ich bin begeistert! 🙂

Trägt man beispielsweise eine Nicht-Email-Adresse in folgendes Feld…

<input type="email" />

bekommt man…

Email Validation im Firefox

Schön wenn man sich noch über solche Kleinigkeiten freuen kann oder 😉

Lange rede kurzer Sinn: Da WordPress alle Formulare an zentraler Stelle definiert, ist es ziemlich einfach sie mit ein paar neuen Input-Types zu versehen. Mit dem folgenden Code wird das Kommentar-Formular mit den Typen "email" und "url" und das Suchformular mit dem Typ "search" (funktioniert nur in den WebKit-Browsern) erweitert:

Code-Update: Eric Eggert hat mich in den Kommentaren darauf hingewiesen, dass man mit <input required /> auch noch die Pflichtfelder validieren kann. Danke!

Code-Update 2: Dank maxe werden jetzt auch die WordPress Settings berücksichtigt (Comment author must fill out name and e-mail) und das "Comment"-Feld ist natürlich auch required

<?php
/*
Plugin Name: html5 input-types
Plugin URI: https://notiz.blog/
Description: Adds the new HTML5 input-types to WordPress' default forms
Version: 0.1
Author: pfefferle
Author URI: https://notiz.blog/
*/

add_filter("comment_form_default_fields", "change_comment_input_types");

function change_comment_input_types($fields) {
  if (get_option("require_name_email", false)) {
    $fields['author'] = preg_replace('/<input/', '<input required', $fields['author']);
    $fields['email'] = preg_replace('/"text"/', '"email" required', $fields['email']);
  } else {
    $fields['email'] = preg_replace('/"text"/', '"email"', $fields['email']);
  }

  $fields['url'] = preg_replace('/"text"/', '"url"', $fields['url']);

  return $fields;
}

add_filter("get_search_form", "change_search_form_input_types");

function change_search_form_input_types($form) {
  return preg_replace('/"text"/', '"search"', $form);
}

add_filter("comment_form_field_comment", "change_comment_field_input_types");

function change_comment_field_input_types($field) {
  return preg_replace('/<textarea/', '<textarea required', $field);
}
?>

Funktioniert als Plugin und in Child-Themes (einfach in die functions.php kopieren).

Danke auch an Marc Görtz der mich über Twitter reichlich mit Links zu dem Thema versorgt hat:

Testen könnt ihr das übrigens hier auf notiz.blog.