で、どうやっているのかなぁと調べてみると、その方法があったので書いてみます。
＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊
◆使うツールSyntaxHighlighter
サイトはこちらです。
◆どういうもの？
基本的なjs、cssと言語毎のjsがあり、それをブログに読み込まれせることでコードにハイライトを付けます。
具体的な見え方は「[仕事]辞書変換に「google-api-translate-java」を使ってみました。」を。
◆手順
1：SyntaxHighlighterをダウンロードします。
2010/09/25現在の最新版は3.0.83でした。
2：seesaaブログ側にアップロード先のディレクトリを作成する。
ファイルをアップロードするディレクトリを作ります。ディレクトリ名は任意でOKです。
3：必要なファイルをアップロードします。
上記ディレクトリに(Seesaaブログの管理画面…「記事投稿」-「ファイルマネージャ」…で)アップロードしていきます。
アップロード先は先程作ったディレクトリです。
※私は、別のディレクトリにアップロードしているのに気づかず、しばしはまっていました。
アップロードする最低限のファイルは以下です。
・styles/shCore.css
・styles/shThemeDefault.css
・src/shCore.js
・scripts/shBrushXxx.js
Xxxは記述したい言語に合わせて行ってください。
対応する言語はこちらで確認してください。
4：ブログのデザインにファイルを読み込ませます。
Seesaaブログの管理画面の「デザイン」-「HTML」でデフォルトHTMLをコピーするなりして、そこにアップロードしたファイルを読み込ませる記述をします。
※hogehoge.up.seesaa.net/syntax/の部分はそれぞれの環境によって異なります。
5：コードとして表示したい所を指定する。
preタグのclass="brush:java;"というように指定します。
public static void main(String[] args) {
System.out.println("hogehoge");
}
※"brush:java;"の部分は読み込ませた言語のjsに合わせてください。後、アップする際のオプションを「改行HTMLタグ変換」を「改行を
タグに変換しない」にして、コード以外の部分には改行タグタグを明示的に入れてください。
＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊
アップロードなどが少し手間ですが、ブログでの見え方もキレイかと思います。
タグ：備忘録
