Formatted snippet to show code

I’ve seen a very nice effect on a number of blogs where code snippets were formatted and (somewhat) syntax highlighted.

I finally got a chance to do some digging and turned up the very cool javascript package called dp-highlighter.

In a nutshell, you put the dp-highlighter files in a folder on your website, then add the following code toward the bottom of any page that needs code highlighted:

<link type="text/css" rel="stylesheet" href="./dphighlighter/SyntaxHighlighter.css"></link>
<script language="javascript" src="dphighlighter/shCore.js"></script>
<script language="javascript" src="dphighlighter/shBrushVB.js"></script>
<script language="javascript" src="dphighlighter/shBrushXml.js"></script>
<script language="javascript">
    dp.SyntaxHighlighter.ClipboardSwf = 'dphighlighter/clipboard.swf';
    dp.SyntaxHighlighter.HighlightAll('code');
</script>

Make sure you change the shBrushVB.js to whichever language parser you want to use. Just be sure to update the paths above.

Finally, for code you want to highlight, just stick it in a <PRE> tag, and add NAME=”code” CLASS=”VB”, if php then put CLASS="PHP" like this...

<pre name="code" class="vb">