在Blogger中插入程式碼

透過JavaScript code prettifier就可以很簡單的將程式碼上色，讓人更清楚的了解。


效果如下：

public class StringSplit{
  int aNumber;
  List<Integer> numbers;
}

以下是如何設定，讓Blogger可以將程式碼上色的步驟：

1. 首先選擇 版面配置
   
2. 選擇 新增小工具
   
3. 選擇 HTML/JavaScript
   
4. 在內容中加入以下的程式碼：
   

   <style>
   li.L0, li.L1, li.L2, li.L3,
   li.L5, li.L6, li.L7, li.L8 {
     list-style-type: decimal !important;
   }
   </style>
   
   <script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js?lang=css&amp;skin=sunburst"></script>
   

   
   
   如圖：
   
   
   
5. 最後，在想要插入程式碼的地方用<pre class="prettyprint linenums"></pre>包起來，如下
   
   <pre class="prettyprint linenums">
   // 這是程式碼的部分
   </pre>

其中<pre class="prettyprint linenums">的linenums表示要顯示行號。
另外，

<style>
li.L0, li.L1, li.L2, li.L3,
li.L5, li.L6, li.L7, li.L8 {
  list-style-type: decimal !important;
}
</style>

則是為了顯示所有行號，而不是每五行顯示一次。

再顯示程式碼時，注意角括號等特殊符號，需要將它們編碼，
可以搭配HTML encoder使用