Embedding code samples in Blogger

Getting code samples into Blogger took WAY more effort than I expected it to -- especially as I wanted to avoid HTML-encoding the samples. What I did to achieve this lofty goal was as follows:

• Get http://alexgorbatchev.com/wiki/SyntaxHighlighter
• Install the .js and .css files into some external location (eg: a Google Sites "file cabinet")
• Add references to the files into the Blogger "Layout"

• ... and call the script to perform the magic

<script type='text/javascript'>
     SyntaxHighlighter.all()
</script>

• Ensure that code sample is embedded within a CDATA section, similar to the following example

<script type="syntaxhighlighter" class="brush: js"><![CDATA[

    function foo()
    {
        if (counter <= 10)
            return;
        // it works!
    }
]]></script>

• ... and crucially (this was the part that took a while for me to discover), turn off "Convert Line Breaks" on the Blogger "Settings | Formatting" page.

PS: "Postable" is a simpler, but less pretty, option here too.