Um Code lesbar zu machen und anschaulich aufzubereiten gibt es einige Helferleins.
Für kleine Codeschnippsel im Text und wenig komplexe Passagen bietet sich Syntaxhighlighting an.
Durch die farbliche Hervorhebung ist der Code schnell nachvollziehbar.
Diese farbliche Hervorhebung des Codes kann per JavaScript oder PHP erfolgen, beides mit den plattformentsprechenden Vor- und Nachteilen.
Für uns kommt im Moment nur eine Umwandlung von Code per PHP in Frage, aufgrund folgender
Vorteile:
- Weniger HTTP Requests
- Dadurch weniger Daten die extra angefragt und übertragen werden
- Schnellerer Seitenaufbau
- Syntaxhervorhebung muss nicht im Browser des Betrachters generiert werden, dadurch geringerer Ressourcenverbrauch und Auslastung auf Seiten des Betrachters
- Bessere Performance auf mobilen Geräten
Natürlich wird der Server durch Umwandeln / Syntaxhervorhebung belastet, was durch Caching aber kein Problem mehr darstellt.
Auf der Suche nach dem passenden Plugin sind wir bei folgenden hängen geblieben:
http://wordpress.org/plugins/wp-syntax/
http://wordpress.org/plugins/better-wordpress-syntax-based-on-geshi/
Beide basieren auf GeSHi, was für uns auch ein Kriterium war.
Entschieden haben wir uns für Better WP Syntax, da es einige Einstellungsmöglichkeiten & Hilfe beim Einfügen in den Editor bietet und das rundere Paket ist.
JS Alternative
Wer Syntaxhervorhebung mit JavaScript clientseitig betreiben will sei hier auf PRISM von Lea Verou verwiesen. Es ist klein, erweiterbar und eben von Lea Verou.
Um PrismJS als Plugin zu verpacken gibt es eine Anleitung bei den Kollegen von Tuts+:
http://code.tutsplus.com/tutorials/adding-a-syntax-highlighter-shortcode-using-prismjs–wp-28718
