これが永久機関ってやつか
ここがSyntaxHighlighterを公開してくれてるところ。
必要な部分だけ超ざっくり説明していくよ。
とりあえずこれやれば表示できるよ！
テンプレート -> HTMLの編集から
</head> の直前(headタグ内なら割とどこもいいけど)に以下を挿入
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushBash.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'/>
対応言語やデザインなどは追加・変更が可能です。上記例ではデフォルトのデザイン、言語はC#、シェルスクリプト、css、xmlに対応するようになっています。
使用法は以下です。
<pre class="brush:[ブラシ名]">
プログラム
</pre>
特殊文字は変換する必要があります。
例
"<" -> <
">" -> >
以下はカスタムしたい時やうまくいかないときのための情報です。
Themes
読み込むcssファイルによってテーマの変更が可能です。
http://alexgorbatchev.com/SyntaxHighlighter/manual/themes/
具体的には
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeXXXX.css' rel='stylesheet' type='text/css'/>
のXXXXに部分を変更します。
Django風とか、Eclipse風とかがあるみたいです。
詳細はリンク先で。
syntaxes
http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/
使用可能な言語の一覧です。
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXXXX.js' type='text/javascript'/>
のXXXXを変更すれば利用可能になります。
中身は大したことないので自分で作ることも恐らく可能です。
Hostingサービス
http://alexgorbatchev.com/SyntaxHighlighter/hosting.html
bloggerだとファイルのアップロードができないので代わりにホスティングされたファイルをリンクします。
ホスティングするファイルのリンク先が切れていた場合などここの情報を確認してみてください。
Configuration
http://alexgorbatchev.com/SyntaxHighlighter/manual/configuration/
いくつか設定が可能なようです。
例えば今回はblogger用に SyntaxHighlighter.config.bloggerMode = true; を追記しています。
他にもpreタグから別のタグへ変更できたり
行番号の表示・非表示を切り替えたり
特定の行をハイライト表示したりできます。
ざっと見ましたが正直どれも微妙な気が...興味があったら見てみてください。
その他
プレビューだとうまく表示されないらしい。
Developer Toolsのコンソールを見てみると
Failed to load resource: net::ERR_CONNECTION_REFUSED https://alexgorbatchev.com/pub/sh/current/styles/shCore.css
Failed to load resource: net::ERR_CONNECTION_REFUSED ...
と言った感じで表示される。
https?
読み込もうとするjs,cssのパスが変わってしまうため使えないらしい。
対処法はわかリませんでしたが公開時はきちんと表示されているのでちょっと不便ですけど使用する分には問題ないかと。
