用SyntaxHighlighter在blogger上貼美麗的code

研究了一個下午，終於研究出解法，特此和大家分享：

1.
至SyntaxHighlighter官網下載他的source，並把自己需要的部分上傳到自己的空間

其中shCore.js、shCore.css、shThemeDefault.css三份檔案是必備的
其他的則是看自己需求做選擇

噹噹！這步是讓我困擾最久的，因為我一開始不知道要上傳到哪....
不過我現在已經上傳到學校提供的空間，後文會分享連結

2.
修改blogger的html檔，在head標籤中貼上

<link href='http://homepage.ntu.edu.tw/~b97103021/shCore.css' rel='stylesheet' type='text/css'/link> <href='http://homepage.ntu.edu.tw/~b97103021/shThemeDefault.css'rel='stylesheet'type='text/css'>
<script language='javascript' src='http://homepage.ntu.edu.tw/~b97103021/shCore.js'/>

以上三者為必備

以下為選擇性
使用css
<script language='javascript' src='http://homepage.ntu.edu.tw/~b97103021/shBrushCss.js'/>
使用javascript
<script language='javascript' src='http://homepage.ntu.edu.tw/~b97103021/shBrushJScript.js'/>
使用python
<script language='javascript' src='http://homepage.ntu.edu.tw/~b97103021/shBrushPython.js'/>
使用ruby
<script language='javascript' src='http://homepage.ntu.edu.tw/~b97103021/shBrushRuby.js'/>
使用java
<script language='javascript' src='http://homepage.ntu.edu.tw/~b97103021/shBrushJava.js'/>

因為我自己通常只會用到上述5種，所以只有上傳這5種到我的空間上
見者有份，歡迎直接取用；若有自己的空間，則把src改為自己的link

4.
在同一份html檔的body tag中，記得要call SyntaxHighlighter.all() 這個function
例如
<script>
SyntaxHighlighter.all()
</script>

5.
之後寫文章時，就可以用
<pre><code class="language-html">

//code

</code></pre>
或
<pre class="brush: rb">
#your code
</pre>
之類的語法貼code，如此一來code就會被上色，且會顯示行數

以上的code依序會顯示

//your code

#your code

另外，blogger目前似乎不支援跳脫html字元的功能（有選項，但似乎沒用）
想要顯示html的tag時，分別要用跳脫字元 & l t 和 & g t取代<和> （我為了正確顯示，所以中間加了空白，使用時不需空白）