用syntaxhighlighter在Blogger语法高亮

早就想要在blog上实现codes的syntax highlighting，但是总是不当回事儿，就这么拖着。今天新建Blogger的blog，想到以后主要记些关于编程和国学的东西，代码是少不了的，所以就做了一些关于这个的工作。

网上有现成的工具，我google了一下，用的是Google Code中alex.gorbatchev的syntaxhighlighter，按照Abhishek Sanoujam的这篇blog设置的。

1.从syntaxhighlighter的project home下载它。解压缩后可以看到文件夹、文件如下：

+---Scripts
¦       clipboard.swf
¦       shBrushCpp.js
¦       shBrushCSharp.js
¦       shBrushCss.js
¦       shBrushDelphi.js
¦       shBrushJava.js
¦       shBrushJScript.js
¦       shBrushPhp.js
¦       shBrushPython.js
¦       shBrushRuby.js
¦       shBrushSql.js
¦       shBrushVb.js
¦       shBrushXml.js
¦       shCore.js
¦
+---Styles
¦       SyntaxHighlighter.css
¦
+---Uncompressed
¦       clipboard.swf
¦       shBrushCpp.js
¦       shBrushCSharp.js
¦       shBrushCss.js
¦       shBrushDelphi.js
¦       shBrushJava.js
¦       shBrushJScript.js
¦       shBrushPhp.js
¦       shBrushPython.js
¦       shBrushRuby.js
¦       shBrushSql.js
¦       shBrushVb.js
¦       shBrushXml.js
¦       shCore.js

Uncompressed这个文件夹何用我不清楚，我用到的是另外两个。从Scripts文件夹里可以看出，syntaxhighlighter支持的语言包括C++、C#、Java、PHP等12种（不错，够我用的啦）。

2.上传文件夹Scripts和Styles里的共15个文件到网上，Google Pages不能用了，所以我用的是yahoo的GeoCities。（Notes：其实也用不到所有的文件，Scripts文件夹中除了clipboard.swf和shCore.js，其他的文件根据各自需要上传就行了，像我不做关于Ruby、Delphi、Python方面的东西，相应的三个文件shBrushRuby.js、shBrushDelphi.js和shBrushPython.js我就没有上传。）

3.修改Blogger的模板，这个在Blogger的“布局->修改HTML”中完成。
首先，在<head>这个tag后面添加如下：

上面的%Path%应该是相应的你上传的各个文件的地址。
然后，在</body>这个tag之前加入一下几行代码：

保存模板。

4.现在可以开始编辑新blog了。在你的codes前后加上<pre>或者<textarea>tag，设置它的name为code，class为相应的语言就行了。如下：

（Notes：Java, C++ or C#的时候用<pre>tag；xml和html的时候最好用<textarea>，因为这个时候有<和>。）

柳东墙

Feb 18, 2009