ブログ上でプログラムの断片を表示する場合、シンタックス・ハイライト機能があれば見やすいですよね。ネットで調べると様々な方法が出てきますが、色々と現状(?)にあってない気もしたので、メモとっておきます。
・テンプレートに必要なjavascript・cssを読み込む。
デザイン -> HTMLの編集 -> テンプレートの編集のheadタグの中に下記を記載。
ここではjavascriptとshのみ読み込んでいます。なうなヤングは、onloadはjqueryとかなんでしょうか?!
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shAutoloader.js' type='text/javascript'/>
<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 type='text/javascript'>
window.onload = function() {
SyntaxHighlighter.autoloader(
'js jscript javascript http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js',
'bash shell http://alexgorbatchev.com/pub/sh/current/scripts/shBrushBash.js'
);
SyntaxHighlighter.all();
};
</script>
・投稿側でpreタグで囲む
<pre class="brush: js">
var x = 0;
</pre>
・参考
本家 http://alexgorbatchev.com/SyntaxHighlighter/ 対応している言語はこちらで調べて下さい。
0 件のコメント:
コメントを投稿