ブログでソースコードをハイライト表示するやり方はいくつかありますが、今回はGoogle Code Prettifyを使いハイライトする方法をメモしておきます。

Google Code Prettifyの使い方

Google Code Prettifyの使い方を順を追って書いていきます。

Google Code Prettifyの導入

CDNをブログ等で読み込みます。これだけで使えるようになります

<script src="https://cdn.jsdelivr.net/gh/google/code-prettify@master/loader/run_prettify.js"></script>

Google Code Prettifyを使ったコード表示

例として、おなじみのJavaのHello Worldを例に書いてみます。

public class HelloWorld{
   public static void main(String[] args){
     System.out.println("Hello World!!");
   }
}

コレをGoogle Code Prettifyで表示するには、このように<pre class="prettyprint">で囲みます。

<pre class="prettyprint">
public class HelloWorld{
   public static void main(String[] args){
     System.out.println("Hello World!!");
   }
}
</pre>

すると、このようにハイライトされて表示されます。

public class HelloWorld{
   public static void main(String[] args){
     System.out.println("Hello World!!");
   }
}

まとめ

導入も簡単で使い勝手もいいです。
興味があれば、Google Code Prettify使ってみてください！