ブログに記述したコードを自分で後でみても良く分からないぐらい汚いのでsyntaxhighlighterを導入することにしてみます。
1.まずsyntaxhighlighter – Google Codeからダウンロード
2.解凍して出来上がった”dp.SyntaxHighlighter”をサーバにアップ。（ｵﾃﾞの場合はブログでサブドメインになっているので、そのサブドメインのﾄﾞｷｭﾒﾝﾄﾙｰﾄにｱｯﾌﾟ）
3.syntaxhighlighterのCSSを追加する。Movable Typeだとメインページ以外にもアーカイブ系にも追加。
以下他にも色々追加しないといけないので、Movable typeだとモジュールで追加した方が楽かな？ということで以下モジュールベースで話を展開。
4.”module.SyntaxHighlighter.txt”というテキストファイルを新規作成。
5.CSS設定の追加。”module.SyntaxHighlighter.txt”に以下の一文を記述。
6.使用言語のshBrushスクリプト(パーサー？)を”module.SyntaxHighlighter.txt”に追記。
種類は
- shBrushCpp.js :C++
- shBrushCSharp.js : C#
- shBrushCss.js : CSS
- shBrushDelphi.js : Delphi
- shBrushJava.js : Java
- shBrushJScript.js : JavaScript
- shBrushPhp.js : PHP
- shBrushPython.js : Python
- shBrushRuby.js : Ruby
- shBrushSql.js : SQL
- shBrushVb.js : Visual Basic
- shBrushXml.js : XML
- shCore.js : COREこれは必須っぽい
といったところ。自分が使用するであろう言語だけ追記。XMLだけ使う場合はこんな感じ。
7.クリップボードコピーの定義。Flashを介在してクリップボードにｺｰﾄﾞをコピーしているらしい。そのファイルは”/Scripts/clipboard.swf”。組み込みは
8.標準ではAction Script用のBrushは存在しないですが、dp.SyntaxHighlighterでActionScript 2.0/3.0のコードをハイライトする at Flaboで配布されていたので入れてみる。（ただ今停止中って書いてあるので動くのか不明ですが）DLして解凍したデータを”dp.SyntaxHighlighter”にマージして”module.SyntaxHighlighter.txt”に追記。最終的な”module.SyntaxHighlighter.txt”はこんな感じ。
9.”module.SyntaxHighlighter.txt”をサーバにアップ。
Movable Typeのモジュールを新規作成。名前を”SyntaxHighlighter”に設定して”このテンプレートにリンクするファイル”にアップした”module.SyntaxHighlighter.txt”のパスを指定して保存。これでモジュールは完成。
10.次にメインページ、アーカイブ各種にモジュールを追記。
11.記述したいコードをtextareaタグで囲み、そのclass名で言語名を指定。
言語名のエイリアスはLanguages – syntaxhighlighter – Google Code – List of supported languages.参照。
どうだろう？上手くいっているのか？
駄目だ～～～汗
全然上手くいかない理由が分かった。
Usage – syntaxhighlighter – Google Code – How to use SyntaxHighlighter.
の
For optimal result, place this code at the very end of your page. Check HighlightAll for more details about the function.
この一文でした。
つまりheadに入れちゃあ駄目なんですね。うん、どこで発動するんだろう？って疑問はあったんだ・・ｗ
ということで
をbodyがCloseした後に入れれば大丈夫。
ちなみにMovabley Typeの改行設定で「改行を変換する」に設定していると、コードの中にも改行タグ
が入ってしまうのですが、この回避方はpreタグ内の改行（brタグ）を無効にする（MT・Movable Type） – ウェブライフハック
追記：2008/11/21 16:43
AS3用のBrushをdigitalflipbook: AS3 Syntax Highlighting (with SyntaxHighlighter)に入れ替えてみました。早くなるかな？
ためしに一つ・・・
どうだろう？
お、結構早いかも。
「syntaxhighlighterを入れてみるの巻」への8件の返信
全然上手くいってない（汗
ここまで上手くいかないと逆にスッキリする。
いやー普通にtextAreaになってんだけどｗ
AS3のBrushはとても重たい気がする。それだけ関数が多いということなのだろうか？
shBrushAS3.jsの中見てみたら、キーワード数は多くないようです。
単純にJSの処理速度と、置換対象のtextareaの数の問題かと。
少なくともうちで公開してるのよか赤い彗星分くらいは速いですねw
はじめまして。
＞単純にJSの処理速度と、置換対象のtextareaの数の問題かと。
ですね、大量にソースを書いていたりすると今でも一瞬止まります。
FlaboさんはもうWPに乗り換えられているので、iG:Syntax Hiliterなんですよね・・。WPに乗り換えるか悩みますが、暇が無くって・・・汗
はじめまして。
挨拶抜きで失礼しました。
>WPに乗り換えるか悩みますが、暇が無くって・・・汗
年末ですもんね。。
iG:SyntaxHiliterだとバックエンドの処理になるんで、キーワード増えても遅くならないのはいいですよ。
でも、iG:SHのためだけにっていうのは本末転倒！？w
>挨拶抜きで失礼しました。
あ、いえいえ、気になさらずに・・。
>キーワード増えても遅くならないのはいいですよ。
ですよねぇ・・・。
WPの乗換えを躊躇しているのは、一つのWPで一つのブログしか管理できないところですね・・。WordPressMUとかあるみたいですが、本家のﾊﾞｰｼﾞｮﾝｱｯﾌﾟにどれくらい追従してくれるのか不安で・・・（ﾌﾟﾗｸﾞｲﾝﾚﾍﾞﾙで対応できるものがあればベストですが）