Code Highlighting With Google's SyntaxHighlighter

It should be noted at this point that this post, now being in an Octopress blog, is no longer relevant. However, I link back to it so many times that it seemed foolish to get rid of it.

This is (mostly) a test post to see how well Google's SyntaxHighligher works. As you hopefully see below (if your browser supports javascript), it works well. I approve!

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function safe($num) {
    // there has to be a smarter way to do this!  
    // make sure that $num is always above 65  
    $diff = date("w",$now) + 65;
    if ($num < 65) {
        $num+=$diff;
    }

    // make sure that $num is in 65-90 or 97-122
    if (($num > 90) && ($num < 97)) {
        $num+=7;
        return $num;
    }
    elseif ($num > 122) {
        // be formulaic rather than arbitrary
        $d = $num-122; $e = $d%7; $f = $d+$e;
        $num-=$f;
        return $num;
    }
    else {
        return $num;
    }
}

I use a combination of plugins that all fight to figure out what to do with PHP soure code. In order to make this work, I used SimpleCode to translate the source into HTML entities so that Exec-PHP wouldn't try to execute the code block.

The default font set for the code display is Consolas, and then the standard Courier New, Courier and then whatever your system's default mono-space or serif fonts are. If you haven't downloaded Consolas, I'd highly suggest it. Scott Hanselman wrote a couple of articles about it, including making Consolas your default Console font, which I do with reckless abandon.

SyntaxHighlighter has a couple of nifty options, such as disabling some extra controls, removing the line numbers and keeping the <pre> block collapsed by default, ideally so that you could have links to expand them as needed. I made one change to the style sheet - making the grey left-hand border 20px thinner. I thought a 45px band of nothing was a bad use of space. The highlighting loads absolutely last on the page so you, the user, don't sit there waiting for it to work in order to begin browsing content.

Sadly, there is currently no highlighting set for Basic, else Tuesday's post would have looked better.

Dec 13th, 2007

Comments