2009年5月23日 星期六

利用SyntaxHighlighter在部落格上顯示程式碼

由於我是個部落格新手,也正開始在學習寫程式,上網也找了一些教學,為了記錄自己的步驟,怕日後忘記,故撰寫此文章記錄......

首先下載 SyntaxHighlighter 解壓縮後,將會有 3 個資料夾,將如下資料上傳至網頁空間:

Scripts 資料夾內的程式(*.js 與 *.swf) 。
Styles 資料夾內的 SyntaxHighlighter.css。


※由於我在google page無法上傳附檔名.js,我也不曉得為什麼,故我是申請 ucoz , 申請步驟請參考 ucoz 提供無限容量、流量的網頁空間,超過900種模版、10多種附加免費服務任你使用!

接下來在部落格按 自訂→版面配置→修改HTML 將如下範例複製到</body> </html>標籤的前面



然後之後只要在文章中將程式碼以如下形式撰寫即可


參考文章:
在 Google Blogger 中使用 SyntaxHighlighter
dp.SyntaxHighlighter 程式碼色彩顯示工具
用SyntaxHighlighter在Blog做程式語法教學說明
http://code.google.com/p/syntaxhighlighter/wiki/Usage
進階參考:
使用 Windows Live Writer + SyntaxHighlighter 整合編輯

0 意見: