Fußnoten in (Blog)Postings [Update]

In meinen letzten drei Postings habe ich Fußnoten eingesetzt. Ich hatte mir vorgenommen, zunächst darüber zu schreiben, warum ich Fußnoten nutze. Aber irgendwie tue ich mich damit schwer, sodass ich zunächst über das Wie schreibe.

Fußnoten werden von den meisten Content Management Systemen (kurz CMS, z.B. WordPress, Tumblr) nicht unterstützt. Also muss man sich einen Weg überlegen, wie man Fußnoten realisiert.

Von Hand zu(r) Fuß(note)

Da die Fußnoten letztendlich auch nur durch HTML-Code dargestellt werden, kann man sie m jeweiligen HTML-Eingabefeld des CMS manuell eingeben.

Hier ein kurzes Beispiel1

<p>In diesem Satz werde ich eine Fußnoten<sup id="fnref:1"><a href="#fn:1" rel="footnote">1</a></sup> unterbringen. Dieser Satz enthält eine zweite Fußnote<sup id="fnref:2"><a href="#fn:2" rel="footnote">2</a></sup>.</p>
<div class="footnotes">
<hr/&
<ol>
<li id="fn:1">
<p>Das ist die erste Fußnote.<a href="#fnref:1" rev="footnote">↩</a></p></li>
<li id="fn:2">
<p>Das ist die zweite Fußnote.<a href="#fnref:2" rev="footnote">↩</a></p></li>
</ol>
</div>

(Hinweis: Die <p>…</p>, die den Anmerkungstext umschließen, sind entbehrlich.)

Das ist jedoch ziemlich aufwändig und fehlerträchtig. Dazu besteht dass Problem, dass man ggf. die Referenzennummern anpassen muss, wenn man eine Fußnote vor einer anderen einfügt.

Daher muss ein Werkzeug her.

WordPress-Plugins

Immer wenn man etwas möchte, das WordPress von Hause nicht kann, dann macht man sich auf die Suche nach einem entsprechenden Plugin. Wenn man im Plugin Driectory von WordPress nach Footnote sucht bekommt man einige Treffer.

Fußnoten erzeugt man mit diesen Plugins, indem man hinter dem zu erläuternden Begriff die jeweilige Beschreibung in eckigen Klammern oder doppelten runden Klammern schreibt.

Ich habe das FD Footnotes Plugin ausprobiert und war relativ zufrieden.

Jedoch war mir die optische Trennung zwischen dem eigentlichen Textblock und den Fußnoten nicht markant genug. Da die Darstellung der Fußnoten jeweils beim Aufbau der Seite erfolgt, kann man hier ohne Eingriff in das Plugin selbst keine Apassung vornehmen kann.

Und hier liegt auch ein Hauptproblem bei der Lösung über ein Plugin. Die Darstellung des Fußnoten kann nur erfolgen, wenn das Plugin installiert ist2. Damit wird man davon abhängig, dass es das Plugin auch in der Zukunft weiter gepflegt wird. Als ich das Plugin nach dem Test deaktiviert habe, “brach” erwartungsgemäß in meinem Testposting die Darstellung der Fußnoten.

Weiterhin habe ich von dieser Lösung Abstand genommen, weil sie naturgemäß auf Postings in WordPress beschränkt ist und auch nicht zu meinem aktuellen Workflow3 passt.

(Multi)Markdown

Da mein aktueller Workflow auf Markdown basiert, lag es nahe eine Lösung in Markdown zu suchen.

Markdown selbst unterstützt keine Fußnoten. Jedoch gibt es einige Markdown-Erweiterungen, die entsprechende Unterstützung bieten. MultiMarkdown bietet eine entsprechenden Funktionalität und wird von der Mehrzahl der von mir genutzten Tools unterstützt.

In MultiMarkdown sieht das obige Beispiel so aus:

In diesem Satz werde ich eine Fußnoten[^Fußnote] unterbringen. Dieser Satz enthält eine zweite Fußnote[^NummerZwei].

[^Fußnote]: Das ist die erste Fußnote.

[^NummerZwei]: Das ist die zweite Fußnote.

Das ist zwar etwas mehr Aufwand, als mit den Plugins, aber bedeutend einfacher, als das obige Beispiel in HTML.

Diese Lösung hat für mich drei Vorteile:

  1. In WordPress wird das Ganze in der aufbereiteten Form in HTML gespeichert. Ich benötige kein Plugin für die Darstellung und kann ggf. die Inhalte auch in ein anderes CMS überführen.
  2. Es funktioniert nicht nur in WordPress, sondern mit jedem CMS, bei dem man entsprechendes HTML vorgeben kann4
  3. Dieser Weg passt zu meinem Workflow.

Es gibt aber auch zwei Nachteile:

  1. Ich kann (nach der Veröffentlichung) direkt in WordPress keine Fußnoten ergänzen, sondern muss das MultiMarkdown editieren, in HTML konvertieren und mit dem erzeugten HTML in WordPress das Posting vollständig überschreiben. Das kann zu Problemen führen, wenn ich doch mal in WordPress kleine Korrekturen vorgenommen habe und diese im Markdown nicht nachvollzogen habe.
  2. Die meisten MultiMarkdown-Konverter handhaben ein klitzekleines Detail bei der Darstellung der Referenznummern anders5, als ich es haben möchte. Das lässt sich durch die Wahl eines passenden Tools bzgl. manuelle Nacharbeit beheben.

Da für mich die Vorteile überwiegen habe ich für diese Lösung entschieden und habe die vorangehenden Posting aus auf diesen Weg erstellt.

Wer seine Postings im WYSIWYG-Editor von WordPress erstellt und damit zufrieden ist, dem empfehle ich die Lösung mit den Plugins. Ob das FD Footnotes Plugin hierfür die beste Lösung ist, kann ich nicht beurteilen. Ein Blick auf die anderen Plugins kann sich auf jeden Fall lohnen.

Update 21.08.2013

Hinweis zu den entbehrlichen <p>…</p> um den Anmerkungstext im obigen HTML-Code-Beispiel ergänzt.


  1. Ich habe das Beispiel natürlich nicht manuell aufgebaut, sondern mir aus MultiMarkdown generieren lassen…
  2. Ich muss zugeben, dass ich nur das FD Footnotes Plugin ausprobiert habe. Daher kann ich nicht ausschließend, dass es vielleicht doch ein Plugin gibt, dass dieses Problem umschifft. Bei einem anderen Plugin finden sich jedoch ganz konkrete Hinweise auf dieses Problem: using a simple mark-up which degrades (kind of) gracefully in the event that for some horrifying reason this plugin no longer works.
  3. Mein Workflow ist eines jener Themen, über das ich schon länger schreiben möchte, es aber bisher nicht geschafft habe. Kurz: Ich erstelle meine Postings fast ausschließlich mit einem “normalen” Texteditor in Markdown und konvertiere erst kurz vor der Veröffentlichung in HTML, das ich dann in WordPress einfüge.
  4. Das ist die schöne Theorie, aber in der Realität erlauben manche Systeme nicht alle HTML-Auszeichnungen oder sie scheitern an der Komplexität des HTML-Konstruktes. Tumblr kann beispielsweise das obige Beispiel im Dashboard sauber darstellen, jedoch scheint das Template mit dem mein Tumblr außerhalb des Dashboard angezeigt wird, bei der Anzeige.
  5. Nach der aktuellen Spezifikation von MultiMarkdown wird die hochgestellte Referenznummer von eckigen Klammern umschlossen, was mich sehr stört und auch eher unüblich ist.