How To quote source code in Blogger posts

Update (06/27/17): This post is now out of date since the underlying js library is no longer hosted. The same can be achieved, more simply in fact, using the highlight.js library (https://highlightjs.org/).

The tutorial for the updated technique can be found at: http://abidmujtaba.blogspot.com/2017/06/highlighted-syntax-code-snippets-in.html

The original post (now defunct) is provided for the sake of posterity:


Since I write this watching "Community" it feels appropriate that my first Blogger post be a meta How-To explaining how to elegantly quote source code in Blogger posts. This feature is a necessity for someone like me starting a blog dedicated to technical topics.

There is a lot of discussion about how to achieve this online. The simplest solution I found and the one I actually applied in this blog itself comes from StackOverflow of course: http://stackoverflow.com/a/10848816/2926226

I often wonder how they managed to program before StackOverflow came along. Verily we stand on the shoulders of giants.

Don't forget to (HTML) escape your code if it contains offending characters like <, >, & .etc. using http://accessify.com/tools-and-wizards/developer-tools/quick-escape/default.php

And now a sample Java Hello World function to show you how it looks:

public String greeting()
{
    return "Hello, World";
}

To create the code block above I entered HTML mode (in Blogger) and entered the following HTML code:

<pre class="java" name="code">
public String greeting()
{
    return "Hello, World";
}
</pre>

Delightfully simple and therefore conducive to efficient technical blogging.