MISTECH 技術手抄本

Syntax Highlighter 可以讓讓程式碼 coding program 在網頁上被明顯的呈現出來，這是一套免費的軟體；雖然官方網站提供 Syntax Highlighter下載，可是 痞客邦 PIXNET 無法上傳這些檔案，所以我們只好使用Syntax Highlighter官方網路線上的引用的方式來使網頁呈現程式語法效果。

作法很簡單，依序下列的步驟就可以達到我們想要的目的：

1. 進入 痞客邦 PIXNET 管理後台，選擇管理後台的部落格。

2. 然後在部落格管理的＂側邊欄位設定＂增加一個名為 JS 的側欄，或是在 「管理後台」-->「部落格管理」-->「側邊欄位設定」-->「頁尾描述」-->「設定」 加入 ，為了網頁美觀建議放在側欄最底部。

3. 在 JS 側欄增加下列的內容

4. 再加入你使用的程式語言，例如C#，如下程式碼
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js" type="text/javascript"></script>

將程式碼貼如下

 <pre class="brush:something">
//這裡輸入程式碼
</pre>
 

紅色部分的文字可以換成你需要對應的程式語言，對照表如下：

其他常見使用技巧，改變行數編號與反白強調，請參考官網首頁右邊按configuration，在<pre>標籤語法內加入，first-line:行數編號的起始號碼，highlight:[數字]反白強調的行數
<pre class="brush: csharp; first-line: 5; highlight: [10, 15]">...</pre>

5. 呈現出來的效果如下：

     
/**
* SyntaxHighlighter
*/
    function foo()
    {
        if (counter <= 10)
            return;
        // it works!
    }