Monday, July 22, 2013

Add Code Syntax Highlighter to your Blogger

Go to the "Template" menu and click "Edit Html" below the current template, add the following lines above the </head>
 
 

In your content, surround the code block by <pre> element, like to one shown below:

<pre class="brush: csharp">private void Download(string url)
{
    WebClient client = new WebClient();
    client.DownloadFileCompleted +=    new AsyncCompletedEventHandler(client_DownloadFileCompleted);
    client.DownloadFileAsync(new Uri(url), @"c:\temp.html");
}

void client_DownloadFileCompleted(object sender, AsyncCompletedEventArgs e)
{
    //do something here
}
</pre>

which will be rendered as:
private void Download(string url)
{
    WebClient client = new WebClient();
    client.DownloadFileCompleted +=    new AsyncCompletedEventHandler(client_DownloadFileCompleted);
    client.DownloadFileAsync(new Uri(url), @"c:\temp.html");
}

void client_DownloadFileCompleted(object sender, AsyncCompletedEventArgs e)
{
    //do something here
}
If your code block contains template such as the one below:

Dictionary<string, string> some_dict=new Dictionary<string, string>();

Change "Dictionary<string, string>" to "Dictionary&lt;string, string&gt;" so that the code syntax highlighter won't display errorly.

One further thing that i found out is that if you are using dynamic view template for your blogger, the code syntax highlighter probably won't work

No comments:

Post a Comment