smart | Webentwicklung
Alles rund um HTML5, PHP, WordPress & Co.

6 Syntax-Highlighter Plugins für WordPress

11. März 2013
Stephan
6 Syntax-Highlighter Plugins für WordPress

Für Blogs in denen des Öfteren mal Code-Auschnitte veröffentlicht werden, bietet es sich an ein Syntax-Highlighter Plugin einzusetzen.

Die farbliche Hervorhebung des Codes kommt dabei vor allem der Lesbarkeit als auch Übersicht zu Gute. Die meisten Syntax-Highlighter Plugins bieten zudem noch weitere nützliche Features, wie z.B. die Anzeige von Zeilennummern oder die individuelle Hervorhebung von einzelnen Zeilen.

In diesem Artikel stelle ich euch 6 Syntax-Highlighter Plugins für WordPress vor.

Falls ihr nur ab und an Code-Ausschnitte veröffentlicht, braucht es nicht unbedingt ein Plugin: Code-Beispiele mit dem pre-Tag darstellen

WP-Syntax

Das Plugin WP-Syntax ist ein bewährtes Plugin zum Highlighten von Code. Allerdings bietet es im Gegensatz zu anderen Plugins relativ wenig Optionen, die ihr individuell einstellen könnt. Vorteil jedoch ist die große Anzahl (weit über 100) an unterstützten Sprachen.

WordPress Plugin: WP-Syntax

FV Code Highlighter

Der FV Code Highlighter hebt euren Code für HTML, CSS, PHP und JavaScript hervor. Falls ihr sowieso nur diese Spachen nutzt, sollte das kein Problem für euch sein. Andernfalls sind das doch recht wenige Sprachen die unterstützt werden. Außerdem gibt es auch hier wenig Einstellungsmöglichkeiten.

WordPress Plugin: FV Code Highlighter

Crayon Syntax Highlighter

Wollt ihr einen Syntax Highlighter haben, der viele Einstellungsmöglichkeiten bietet, dann könnte der Crayon Syntax Highlighter das richtige Plugin für euch sein.

Vom Design (Theme) über die Schriftart, die integrierte Symbolleiste bis hin zu Art der Einbindung der Plugin CSS- & JavaScript-Dateien könnt ihr alles individuell anpassen.

Das Plugin werde ich demnächst mal ausgiebig testen, da es auf den ersten Blick einen wirklich guten Eindruck macht. Vorteil ist auch die extra Dokumentation der Einstellungen.

WordPress Plugin: Crayon Syntax Highlighter

WP-GeSHi-Highlight

Bei WP-GeSHi-Highlight handelt es sich um einen Fork bzw. Weiterentwicklung vom bereits erwähnten WP-Syntax. Dementsprechend unterstützt das Plugin die gleichen Sprachen.

WordPress Plugin: WP-GeSHi-Highlighter

Prism Syntax Highlighter

Prism Syntax Highlighter ist noch ein recht neues Plugin, dass aber auch einen sehr ansprechenden Eindruck macht. Scheint auch ziemlich up-to-date zu sein was Technik & Performance angeht:

– only 1.6KB minified & gzipped […]
– supports parallelism with Web Workers […]

(Prism-Website)

Auch für dieses Plugin gibt es eine extra Dokumentations-Website.

WordPress Plugin: Prism Syntax Highlighter

SyntaxHighlighter Evolved

Das letzte Plugin, welches ich hier aufführe, ist SyntaxHighlighter Evolved. Dieses Plugin setze ich auch hier im Blog ein und bin bis dato vollends zufrieden damit. Grundsätzlich werden alle wichtigen Sprachen unterstützt die ich benötige und Einstellungen bietet das Plugin auch zu Genüge an.

WordPress Plugin: SyntaxHighlighter Evolved

Fazit

Neben den vorgestellten Plugins gibt es noch viele andere Syntax-Highlighter Plugins.

Dabei sind der Prism Syntax Highlighter, Crayon Syntax Highlighter und SyntaxHighlighter Evolved die Plugins, die mich am meisten überzeugt haben. Die beiden erst genannten werde ich bestimmt mal näher testen, da beide viele nützliche Features anbieten, die SyntaxHighlighter Evolved nicht bietet.

Nutzt ihr in eurem Blog ein Plugin zum Hervorheben eurer Code-Ausschnitte? Wenn ja, welche nutzt bzw. bevorzugt ihr?

Kommentare  
6 Kommentare vorhanden
1 Pascale Beier schrieb am 14. März 2013 um 15:40 Uhr

Ich habe früher mal Prism ohne Plugin benutzt, das hat mir sehr gut gefallen. Was mich sehr oft stört bei diversen Syntax-Highlightern ist das Kopieren des Quelltextes: Manchmal werden da die Zeilennummern mitkopiert, das ist ziemlich ätzend.

SyntaxHighlighter Evolved sehe ich wirklich sehr oft gerade bei WordPress-Blogs, aber ich bevorzuge doch eher Prism. (Auch wenn ich noch keine Not verspüre, so ein Plugin einzusetzen)

Grüße,
Pascale

2 Stephan L. schrieb am 16. März 2013 um 12:56 Uhr

Hi Pascale,

oh ja, dass Problem mit den Zeilennummern kenne ich nur zu gut. 😉

Hatte mir gestern Prism und Crayon mal näher angeschaut. Prism ist für mich derzeit aber keine wirkliche Alternative zu Syntax Highlighter Evolved, da die Sprachunterstützung doch recht mau ist. Es wird ja so wie ich gelesen habe, bis dato noch nicht mal php unterstützt.

Crayon ist für mich zurzeit das beste WordPress-Plugin für Syntax Highlighting. Im Vergleich zu Evolved bindet es aber eindeutig viel zu viele Ressourcen ein und erzeugt somit unnötig viele HTTP-Requests. Zusätzlich sind die Dateien, was die Größe betrifft, nicht gerade klein.

Also bleibt bei mir erst mal alles beim alten, was Syntax Highlighting angeht.

Grüße

Stephan

3 Viktor schrieb am 18. März 2013 um 18:39 Uhr

Hallo Stephan ,
Hab auch lange einen Plugin gesucht für Code-Auschnitte und fundig geworden , wo auch mein wahl gefahlen.

CodeColorer

Dieses Plugin erlaubt dir ein Codeschnipsel mit schönen Syntax-Hervorhebungen unterstützt von der GeSHi Library in deinen Beiträgen einzufügen.

HTML5 valide und leicht (mit Vorschau) einstellbar.

MfG
Viktor

4 Robin schrieb am 4. April 2013 um 13:45 Uhr

Warum hat dich WP-GeSHi-Highlight nicht überzeugt? Fahre damit recht gut und es bietet gegenüber dem normalen WP-Syntax ja noch einige Optimierungen des Codes.

5 Julian schrieb am 21. Oktober 2013 um 01:25 Uhr

Hey,
erstmal Danke für die kurze Übersicht. Ich werde mir dann wohl mal Prism Syntax annschauen.

@Viktor, naja CodeColorer hab ich mal kurz nachgeschaut – hab ich etwas falsch gelesen oder ist der total outdated? Lt. wordpress Page ist die aktualisierung über zwei Jahre her.

Viele Grüße,
Julian

6 Jan-Philip Gehrcke schrieb am 17. Juni 2015 um 17:08 Uhr

Hallo,

ich bin der Autor von WP-GeSHi-Highlight. Ich habe gerade selbst noch einmal nach Alternativen gesucht (auf Deutsch gegoogled :-)) und bin auf deinen Artikel gestoßen. Erstmal danke für die Erwähnung in deinem Artikel!

Wichtig ist die Unterscheidung zwischen clientseitigen Highlightern (welche JavaScript benötigen) und solchen, die alleinig im back-end arbeiten (und nur entsprechenden HTML- und CSS-Code ausliefern). WP-GeSHi-Highlight gehört zu der letzten Kategorie. Dieser Ansatz ist unter Garantie der effizienteste, insbesondere in Kombination mit einer Caching-Lösung. Der Client muss nur anzeigen und keinen Code ausführen.

Für mich ist weiterhin wichtig zu erwähnen, dass WP-Syntax seit Jahren augenscheinlich keine Aufmerksamkeit mehr durch den/die Entwickler erfährt. Es gab vor 2-3 Jahren nochmal ein Update, aber dabei blieb es dann auch.

Auch CodeColorer, was hier in den Kommentaren genannt wurde, wird nicht mehr gewartet.

Wer also in der Kategorie back-end Highlighter sucht: ich warte WP-GeSHi-Highlight jetzt schon seit 5 Jahren und werde es auch weiterhin tun.

Grüße!

0 Trackbacks/Pingbacks vorhanden
Du bist herzlich eingeladen auch ein Kommentar zu hinterlassen!
Kommentar schreiben

Vielen Dank für dein Kommentar!