Bloggerでコード整形を行う

Bloggerに張っているソースコードやコマンドの実行結果等が見にくいので、下記のブログを参考にデザインを変更してみた

seiji's 十八番: [SyntaxHighlighter] bloggerに整形済みテキスト、プログラムソースコードなど...

SyntaxHighlitghterは以前、ExtJSでSVNビューワを作ったときに使ったことがあったので久しぶりに使ってみた。

やることは、上記のリンクに書いてある通り。ただ、使用するブラシの種類が違っていたのでそこだけ、選択を変えた。
現在使っていないプログラミング言語はばっさり捨て、テキスト用に「Plain」をdiff用に「Diff」を追加した。「Xml」は外しかけたが、htmlを整形するために必要だった。

差し込んだコードは以下の通り。

<!--ここからsyntaxHighlighterをコピペした-->
<link type='text/css' rel='stylesheet' href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' />
<link type='text/css' rel='stylesheet' href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' />
<script type='text/javascript' src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' />
<script type='text/javascript' src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' />
<script type='text/javascript' src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushDiff.js' />
<script type='text/javascript' src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' />
<script type='text/javascript' src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js' />
<script type='text/javascript' src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPlain.js' />
<script type='text/javascript' src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' />
<script type='text/javascript' src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' />
<script language='javascript'>
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.all();
</script>

ついでにメインのカラムの横幅を少し広げて表示できる桁数を増やした

-      <b:variable default='960px' name='content.width' type='length' value='860px'/>
----
+      <b:variable default='960px' name='content.width' type='length' value='1000px'/>