blogspot.comにSyntaxHighlighterを導入する。

いろいろソースコードを掲載する予定なのでこんな風に表示したい。

var print = function(e){
  console.log(e);
}

手作業でハイライトを編集するのは面倒なのでSyntaxHighlighterを導入することにした。




<head/>にソースを追加。

blogspot.comのダッシュボードからデザイン>HTMLの編集を選択。<head/>を見つけて最後の要素として以下のものを追加。

<link href="http://sites.google.com/site/bloggermintcom/shCore.css" rel="stylesheet" type="text/css"></link>

<link href="http://sites.google.com/site/bloggermintcom/shThemeDefault.css" rel="stylesheet" type="text/css"></link>

<script src="http://sites.google.com/site/bloggermintcom/shCore.js" type="text/javascript"/>

<script src="http://sites.google.com/site/bloggermintcom/shBrushCss.js" type="text/javascript"/>

<script src="http://sites.google.com/site/bloggermintcom/shBrushJScript.js" type="text/javascript"/>

<script src="http://sites.google.com/site/bloggermintcom/shBrushXml.js" type="text/javascript"/>

<script type="text/javascript">
SyntaxHighlighter.all()
</script>

使い方

<pre class=”brush: xml”>
Your script here
</pre>