HOWTO: post code

Posting code is made quite easy by using SyntaxHighlighter. It's pretty easy to set up and works on any html sites, as well as blogger and wordpress. I'll be using it heavily throughout these posts. 3 easy steps:

  1. Include the SyntaxHighlighter.css file at the top of your page.

    <link type="text/css" rel="stylesheet" href="/php/js/dp.SyntaxHighlighter/Styles/SyntaxHighlighter.css"></link>
    
  2. At the bottom of the page, include the brushes and other js files you will need, as well as the function call to stylize the <pre> tags:

    <script language="javascript" src="/php/js/dp.SyntaxHighlighter/Scripts/shCore.js"></script>
    <script language="javascript" src="/php/js/dp.SyntaxHighlighter/Scripts/shBrushCSharp.js"></script>
    <script language="javascript" src="/php/js/dp.SyntaxHighlighter/Scripts/shBrushXml.js"></script>
    <script language="javascript" src="/php/js/dp.SyntaxHighlighter/Scripts/shBrushPython.js"></script>
    <script language="javascript">
    dp.SyntaxHighlighter.ClipboardSwf = '/flash/clipboard.swf';
    dp.SyntaxHighlighter.HighlightAll('code');
    </script>
    
  3. Then, place the code you want in between these two steps using <pre> tags that the javascript will stylize

    <pre name="code" class="html">
    <!-- code here -->
    </pre>
    <pre name="code" class="python">
    # code here
    </pre>