PHP Blogger

Startseite Schreib mir ne Mail! RSS Abo Webnews

Syntax-Highlighting auf Blogs

Viele Blogger berichten von großen und kleinen Errungenschaften. Oft geht es um Codebeispiele die CSS, HTML, PHP oder andere Programmiersprachen betreffen. So auch der PHP Blogger. Hier geht es natürlich vorzugsweise um PHP, aber auch andere Sprachen werden gelistet.

Um ein schickes Syntax-Highlighting auf seinem Blog anbieten zu können, kommen mehrere Varianten in Betracht. Die schönste ist meiner Meinung nach mittels Starlight von Dean Edwards, über das ich bereits im Artikel “Highlight-Express” berichtet habe.

Das Prinzip ist denkbar einfach: Man nehme ein <pre> Tag und forme ihn um den Beispielcode. In etwa so:

<pre>alert(’Fancy Javascript!’);</pre>

Dann gibt man noch ein Quentchen class-Attribut hinzu und würze es mit der entsprechenden Sprache:

<pre class=”js”>alert(’Fancy Javascript!’);</pre>

und fertig ist das Syntax-Highlighting…

alert('Fancy Javascript!');

Die wichtigsten Sprachen sind bereits in Dean Edwards Archiv enthalten. Neben einer Erweiterung für Blogs mit Permanlinks (siehe den Artikel “Highlight-Express“), habe ich nun das Syntax-Highlighting für MySQL hinzugefügt.

Das Highlighting für T-SQL war nur bedingt geeignet, da es in erster Linie für Stored Procedures gedacht ist. Das überarbeitete und erweiterte Archiv liegt im Downloadordner bereit.

Wichtig: Bitte beachtet, das es zum Einbinden in Blogs mit Permalinks nun eine eigene CSS-Datei mit dem schönen Namen “perma-star-light.css” gibt.

  • MisterWong
  • del.icio.us
  • Technorati
  • Digg
  • Slashdot
  • YahooMyWeb
  • Furl
  • Ma.gnolia
  • Spurl
  • Netscape
  • StumbleUpon
  • MyShare
  • blogmarks

WordPress Designpraxis » Blog Archive » Code Snippet Highlighting meint dazu:

2. August 2007 um 14:53

[...] reading about Dean Edwards “star-light” syntax highlighting library on phpblogger.net, I decided to turn the results of their tutorial into a WordPress Plugin called [...]

Perun meint dazu:

3. August 2007 um 17:38

Um Code-Beispiele richtig auszuzeichnen musst du das code-Element einsetzen. Das du du die Zähling mittels CSS vornimmst ist auch nicht ganz richtig, da die Zählung zum Inhalt (X)HTML) und nicht zum Design (CSS) gehört.

timi meint dazu:

3. August 2007 um 18:31

Hi Vladi,
ich gebe Dir Recht: wenn mans ganz genau nimmt, ist das code-Tag dafür gedacht, Code-Snippets zu markieren - allerdings inline. Wie Du unter http://www.mediaevent.de/xhtml/code.html nachlesen kannst (und als CSS-Buch-Autor sicherlich ohnehin weißt), ist das pre-Tag ebenfalls geeignet, um vorformatierten Text zu markieren…
Mit der Zählung meinst Du sicherlich die Zeilennummerierung. Ich bin mir sicher, dass Du in keinem Deiner Quellcodes im Livebetrieb eine Nummerierung am Anfang jeder Zeile stehen hast - das ist ein Goodie Deiner IDE - und gehört deshalb eindeutig zum Layout und nicht in den Code.

PHP Blogger: Syntax-Highlighting in Wordpress - Ein PHP Blog auf deutsch meint dazu:

30. Mai 2008 um 10:00

[...] sehr cool! Das von Dean Edwards entwickelte und dem PHP Blogger erweiterte Star-Light Syntax-Highlighting gibt es seit einiger Zeit als Wordpress-Plugin. Wenn das mal nichts feines ist… Ein Test samt [...]

RSS für Kommentare zu diesem Artikel · TrackBack URI

Schreib Deine Meinung