Christophs private Website
 × 
zurück

Markdown

// 02. 03. 2013

Ich hatte beim letzten Mal versprochen, etwas über die Technologie hinter CUBlog zu schreiben. Auf geht's …

Obwohl ich "fließend" HTML schreiben kann, wollte ich meine selbstgemachte Blogsoftware etwas komfortabler gestalten. Ich habe lange überlegt, wie ich meine Blogtexte formatiere. Ein durchschnittlicher Anwender würde sicherlich einen WYSIWYG-Editor erwarten. Ich habe mich aber aus zwei Gründen dagegen entschieden:

  1. HTML kennt keine native Eingabemöglichkeit für WYSIWYG. Alle WYSIWYG-Editoren für's Web sind mit Javascript (oder Java oder Flash) implementiert. Keiner davon ist richtig gut und alle sind nur – mehr oder minder – kompliziert in eine Website zu integrieren.

  2. Viel wichtiger war mir aber, dass man mit WYSIWYG grundsätzlich immer das Aussehen eines Textes formatieren kann. Das ist zwar zunächst eine feine Sache, wird aber immer dann unübersichtlich, wenn man eigentlich nur ganz wenige Formatierungen zulassen möchte, die dann aber immer gleich aussehen.

Ich habe mich daher dafür entschieden, für CUBlog Markdown zu verwenden. Markdown wird beschrieben als

Markdown is a text-to-HTML conversion tool for web writers. Markdown allows you to write using an easy-to-read, easy-to-write plain text format, then convert it to structurally valid XHTML (or HTML).

Markdown-Texte werden in einer Syntax ähnlich einer Wiki-Syntax geschrieben. Vorteil gegenüber der Wiki-Syntax ist, dass man HTML – falls man es braucht - einfach in den Markdown-Source "reinmixen" kann.

Zur Konvertierung nach HTML habe ich nicht die Original-Implementierung von John Gruber verwendet (die ist nämlich in Perl geschrieben), sondern Markdownj - einen Java-Port von Alex Coles.

Die Konvertierung von Markdown zu HTML mit markdownj ist wirklich super einfach:

String markdown = "This is **bold** and that's "+
                  "a [hyperlink](http://de.wikipedia.org/wiki/Hyperlink)";
MarkdownProcessor markdownProcessor = new MarkdownProcessor();
String html = markdownProcessor.markdown(markdown);

Das war's. Jetzt nur ein vernünftiges Stylesheet angelegt und schon sieht das hier relativ gut aus.

Übrigens, wer Markdown testen möchte: es gibt eine Website, wo man sich online Markdown-Source in HTML umwandeln lassen kann:

Viel Spass beim ausprobieren.


Archiv