SyntaxHighlighter | soohei.net

SyntaxHighlighterを導入。
<pre name="code" class="actionscript"></pre>
でコードに色を付けてくれる。

× WordPressのプラグインを使えば、

[sourcecode language='css'] … [/sourcecode]

や

[css] … [/css]

のような表記でもいけるらしいが、色々微妙で削除。

– WordPress › SyntaxHighlighter« WordPress Plugins
– WordPress › SyntaxHighlighter Plus « WordPress Plugins

× WorPress上に設定パネルができて、使う言語とかオプションを設定できる
プラグインもあったが、<pre>タグではなく、<textarea>タグで
挿入されるのがなんとなく気持ち悪いので削除。
– SyntaxHighlighter @ Open Sourced Brain.

○ 結局、Mark氏が公開しているAS3用のjsだけ追加した。
– AS3 Syntax Highlighting (with SyntaxHighlighter)

△ また、IE6 (Mac OSX 10.5 – Parellels – Win xp) で奇数の行番号が
なぜか全部1になってしまったのだが、対策を考えるのが面倒になって、

と書いて、行番号を出さないことにした。

– Configuration – syntaxhighlighter – Google Code

—-

やり方をまとめると、

1) syntaxhigHlighterをダウンロード
– http://code.google.com/p/syntaxhighlighter/

2) Mark氏のサイトからAS3用拡張をダウンロード
– http://www.digitalflipbook.com/archives/2007/09/as3_syntax_high.php

3) 1を解凍したフォルダ内、dp.SyntaxHighlighter/Scripts に
shBrushAS3.js を追加

4) 3と同様に dp.SyntaxHighlighter/Styles/SyntaxHighlighter.css を
2のStyles内のものと置き換え（見やすいので）

5) jsとcssの入ったフォルダをアップロード

6) js, cssへのパスを通す

<link type="text/css" rel="stylesheet" href="/blog/styes/SyntaxHighlighter.css"></link>
<script language="javascript" src="/blog/scripts/shCore.js"></script>
<script language="javascript" src="/blog/scripts/shBrushAS3.js"></script>
<script language="javascript" src="/blog/scripts/shBrushXml.js"></script>
<script language="javascript">
window.onload = function () {
dp.SyntaxHighlighter.ClipboardSwf = '/blog/scripts/clipboard.swf';
dp.SyntaxHighlighter.HighlightAll('code');
}
</script>

7) 以下のタグでコードを囲む。

<pre name="code" class="actionscript">
 ...
</pre>