Tuesday, April 15, 2008

Syntax Highlighting in Blogger

Using Blogger is easy, that is if you don’t want anything special. The editor allows you to add text, images and movie clips. Now this is all nice for the ordinary user but for a developer that would like to share his ideas and add code examples this is not sufficient.

At first I tried using Google Docs http://docs.google.com/ because when using this you can create and work on new posts and when finished you would just publish it on Blogger. When I copied code from my IDE it would look the same, but when exporting it to Blogger all indentation was lost and an enormous amount of extra HTML was generated. Too bad because this would be an ideal way to blog, you could even re-open your documents and re-publish.

After that I have been searching for solutions that would give me syntax highlighting in Blogger and I did find a really nice solution from Alex Gorbatchev http://code.google.com/p/syntaxhighlighter/ that is using JavaScript to parse the text between certain <pre> tags and provide the correct highlighting. Now this is a great solution, I was missing the syntax highlighting for ASP.Net files.

I could have easily added the ASP.Net functionality if I was not already using another solution from Wilco Bauwer http://www.wilcob.com/Wilco/Toolbox/SyntaxHighlighter.aspx to do my syntax highlighting on my website. So what I did was I created a single page that would convert my code into HTML code with the correct syntax highlighting. After that I would just copy this in Blogger using the html editor. I only needed to add a reference to my own style sheet (CSS). You can see and use my little tool on http://www.nijhof.com/FormatCode/.

This is still not an ideal solution, but it is one that I can live with for now.

No comments: