Monday, September 22, 2008

Syntax Highlighting in Blogger

Recently, I've gone through and added syntax highlighting to some of my previous posts. This was done for Java, XML, and SQL. There is a great set of CSS files and JavaScript to accomplish this called SyntaxHighlighter. The downside, however, is that Blogger does not make integrating these tools very easy. I tried several times, but always managed to screw something up. As a result, I was very happy to come across a Blogger Widget for SyntaxHighlighter. All you need to do is add this widget to your blogger layout. Remember to leave the title blank so that you don't see an empty section in your sidebar. Once you've added this widget, you can add syntax highlighting similar to what you see here. To highlight Java, for example, edit the HTML of your post and surround your Java code with :


<pre name="code" class="java">
</pre>

That's all there is to it. A finished example would look like this, once highlighted:



public class MyClass {

private int myInt = -1;

public int getMyInt() {
return this.myInt;
}

public void setMyInt(int myInt) {
this.myInt = myInt;
}
}