Das Framework SyntaxHighlighter eignet sich für so ziemlich alle gängigen Programmier- und Auszeichnungssprachen inklusive HTML, CSS und auch SQL. Es müssen lediglich 2 JS-Dateien und die entsprechenden Styles eingebunden werden.
Im Artikeltext markiert man den Code dann mit einem umschließenden <pre> und erweitert es mit dem Klassenkonstrukt class="brush: js;" (hier JavaScript). Soll innerhalb des Preview-Tags auch HTML erkannt werden muss noch ein html-script: true hinzugefügt werden. Zugutelertz muss die Funktion SyntaxHighlighter.all(); zum Starten aufgerufen werden.
Quellcode:
<pre class="brush: js; html-script: true">
$(document).ready(function() {
$('a[rel*="external"]').click(function(){
$(this).attr('target','_blank');
});
});
<span>noch etwas html...</span>
Das ganze sieht dann so aus:
$(document).ready(function() {
$('a[rel*="external"]').click(function(){
$(this).attr('target','_blank');
});
});
noch etwas html...
Viel Spaß!
