10 WordPress Plugins zum Anzeigen und Syntax-Highlighting von Code-Schnipseln in Beiträgen

Wenn du dein Wissen rund ums Programmieren gerne mit deinen Lesern teilst, sollst du dafür sorgen, dass Code-Beispiele in deinem Blog gut lesbar und korrekt ausssehen. Mit diesen Plugins baust du Code-Schnipsel in Beiträge einfacher ein.

Code-Schnipsel in WordPress darstellen kann zur richtigen Herausforderung werden. Jeder, der jemals versucht hat, eine Zeile Code oder Code-Beispiele in einen WordPress-Beitrag einzubinden, weiß, wie schwierig es  sein kann,  korrektes Anzeigen zu erreichen. Glücklicherweise gibt es einen einfachen und effektiven Weg, das zu tun. Eine Reihe von Code Snippets Plugins für WordPress stellt die ursprüngliche Formatierung des eingefügten Codes sicher.

Das ist insbesondere wichtig für Programmierblogs und Projekte mit Tutorials, wo in Seiten riesige Code-Blocks eingebaut werden. Hierbei ist es ausschlaggebend, die Modifikation von WordPress zu verhindern und Originalzeichen und -symbole beizubehalten. Also, mit diesen Plugins kannst du Code-Schnipsel problemlos hinzufügen, sodass sie ohne Änderungen angezeigt werden:

Snipplr

Bei diesem Plugin handelt es sich um eine Schnittstelle, um den Code einzufügen und zu teilen. Du musst ein Konto registrieren, um einen API-Schlüssel zu erhalten. Das Anmelden geht sehr schnell. Danach sollst du die Einstellungsseite nach unten scrollen und den API-Schlüssel in die Zwischenablage kopieren.

Preserve Code Formatting

Mit Preserve Code Formatting kannst du einfach Code-Schnipsel in den Code einfügen, und dieses Plugin hält WordPress davon ab, in HTML zu kodieren und deinen Code zu ändern. Leerzeichen können optional beibehalten werden. Wenn du Beiträge mit dem aktivierten Visual Editor erstellst, wird dieses Plugin durchaus funktionieren. Dennoch werden "' Zeichen nicht unbedingt korrekt angezeigt.  

 Code Snippet

Code Snippet stellt ein WordPress-Plugin dar, das die Syntax-Hervorhebung von Code-Schnipseln in Blogbeiträgen ermöglicht. Es setzt GeSHi ein - eine flexible Highlighter-Software. Dieses Plugin unterstützt eine große Anzahl von Sprachen und kann einfach um neue erweitert werden.

CodeColorer

CodeColorer ist ein Syntax-Highlighting-Plugin, mit dem du Code-Schnipsel in Blogbeiträge einfügen kannst. Das Plugin bietet attraktive Syntax-Hervorhebung. Es unterstützt Farbschemata, Code in RSS, Kommentaren und basiert auf der GeSHi-Bibliothek, die mit meisten Sprachen kompatibel ist.

 FV Code Highlighter

Das FV Code Highlighter-Plugin unterstützt das Highlighting von PHP, HTML, CSS und XML. Das Standard-Farbschema verwendet die gleichen Farben wie Adobe Dreamweaver. Dadurch lässt sich leichter erkennen, welchen Code du geschrieben hast. Du kannst diese Farben im WP-Admin-Bereich deines Blogs bei Bedarf ändern.

Syntax Highlighter Evolved

Syntax Highlighter Evolved erweist sich als effektiv, um Code-Schnipsel in deinem Blog hervorzuheben, indem die Formatierung beibehalten bleibt. Du musst dabei keine Änderungen am Code vornehmen. Das Plugin setzt das SyntaxHighlighter JavaScript-Paket von Alex Gorbatchev ein und und unterstützt alle Paket-Parameter über Eigenschaften im Shortcode.

My Syntax Highlighter

Dieses intuitive Plugin macht es möglich, den Quellcode mit der Syntaxhervorhebung in Beiträge und Seiten einzubetten, ohne dass die Formatierung verloren geht. My Syntax Highlighter unterstüzt 13 Sprachen, und 36 Themes. Das Plugin verwendet die CodeMirror-Bibliothek und setzt über 16 verschiedene Shortcodes ein, mit denen sich der Code einfach anzeigen lässt.

Enlighter – Customizable Syntax Highlighter

Enlighter ist ein Tool zum Syntax-Highlighting für WordPress. Es ermöglicht automatische Erstellung von Tab-Panes, um Code-Snippets z.B. für verschiedene Sprachen zusammen darzustellen. Das Plugin lässt sich in den Gutenberg Editor (Beta-Version) und Classic Editor integrieren. Enlighter ist DSGVO-konform, also keine externen Ressourcen sind erforderlich, und Daten werden nicht aggregiert.

Prismatic

Prismatic bietet Ihnen drei Optionen, um den Code anzuzeigen: Prism.js, Highlight.js und Plain. Die ersten zwei verwenden ihre eigenen Bibliotheken, während das dritte Plugin den Code ohne Syntaxhervorhebung anzeigt (so dass du das Aussehen anpassen kannst). Das Plugin ist leichtgewichtig und lädt CSS/JS nur bei Bedarf.

Code Prettify

Code Prettify setzt die Google Code Prettify-Bibliothek ein, um automatisch jeden Code innerhalb innerhalb des pre- oder code-Tags hervorzuheben. Das Plugin ist mit Gutenberg kompatibel und schränkt dich mit spezifischen Anforderungen ans Markup nicht ein.

HTML Editor Syntax Highlighter

Mit HTML Editor Syntax Highlighter ist es viel einfacher, Code-Schnipsel in Beiträge einzufügen und bestimmte Code-Zeilen hervorzuheben.  Dieses Plugin verfügt über einen handlichen Editor mit mehreren Funktionen, die sich bei der Code-Bearbeitung als hilfreich erweisen. Es bietet das Syntax-Highlighting unter anderem auch für den Gutenberg-Editor.

Übersichtliche und leicht lesbare Code-Darstellung macht es deinen Blog-Lesern einfacher, Code-Schnipsel zu kopieren und in ihre eigenen Seiten einzubauen. Lass uns in Kommentaren wissen, wenn wir empfehlenswerte Plugins vergessen haben!