Linux Kernel Programming: How to add Syntax Highlighter to Blogger Blog ?

Hmmm...! finally I come across an awesome syntax highlighter that i think will work well for most any application and it works well on Blogger Hosting which is even better. It uses a flash swf to do a click to copy button and has support for a variety of languages as well as a bunch of themes.

Here i go through couple of steps that would make you add syntax highlighter to your blog.

Step1:

Paste this below code into your Blogger Template just above the </head> tag.
This supports many languages, delete the line of code which ever the language you don't use.

Copy the below code:

<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/> 
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushVb.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'></script> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js' type='text/javascript'></script> 
<script language='javascript'> 
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/current/scripts/clipboard.swf';
SyntaxHighlighter.all();
</script>

Step2:

Save the template.
Then you can start creating code blocks in your existing or new Blog entries.
There are 2 ways to add a code block using syntaxhighlighter.

Method 1: Using the script Tag

<script type=&quot;syntaxhighlighter&quot; class=&quot;brush: csharp&quot;>
<![CDATA[
// Comment
public class Testing {
public Testing() {
}
public void Method() {
/* Another Comment
on multiple lines */
int x = 51;
}
}
]]></script>

becomes:

// Comment
public class Testing {
    public Testing() {
    }
    public void Method() {
        /* Another Comment
           on multiple lines */
        int x = 51;
    }
}

Method 2: Using the pre Tag

<pre class="brush: csharp">// Comment
public class Testing {
public Testing() {
}
public void Method() {
/* Another Comment
on multiple lines */
int x = 51;
}
}
</pre>

becomes:

// Comment
public class Testing {
    public Testing() {
    }
    public void Method() {
        /* Another Comment
           on multiple lines */
        int x = 51;
    }
}