2012年7月15日日曜日

【Blogger】beautyOfCodeを導入してみた

このエントリーをはてなブックマークに追加 Clip to Evernote
やっぱりシンタックスハイライトは入れときたいよなーということで、
前回に引き続き Blogger カスタマイズ Tipsまとめ を参考にさせていただきました。

1.beautyOfCode.jsを読み込むようにテンプレートにコードを挿入
headタグの中にコードを入れましょう。
私の場合はheadタグの一番最後に記述しました。
jqueryを読み込むのを忘れずに(ちょっとハマったww)


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript">
<!-- jQuery / beautyOfCode-->
<script src='http://android-beryl.googlecode.com/hg/api/resources/jquery.beautyOfCode.js?r=b338c627a7179b4d9cb0258f7a719cc3917bf5a4'/>
<script type='text/javascript'>
//<![CDATA[
  <!--
  $.beautyOfCode.init({
  brushes: ['Xml', 'JScript', 'CSharp', 'Plain', 'Php', 'Ruby', 'Java'],
  theme: 'Eclipse',
  ready: function() {
  $.beautyOfCode.beautifyAll();
  $("#someCode").beautifyCode('javascript', {gutter:false});
  }
  });
  //-->
//]]>
</script>


2.ブログで使う場合

こんな感じで使うらしい。
codeタグの中に、XML/HTMLタグを書く場合は、変換ツールを使って記述しないといけないことに注意!
HTMLタグ変換ツール

<pre class="code">
  <code class="JScript">
   // ここにコードを書く
  </code>
</pre>

これで完了。


が、私のブログだとシンタックスが効かないのはどうしてだろう。。
原因は別にありそうなので、もうちょっと調べることにしよう。。。

0 件のコメント:

コメントを投稿