長尾巴的魚: 如何在 google blog 上面放 source code

2006-12-20

如何在 google blog 上面放 source code

之前想要在blog上面放上自己的source code. 但是找不到比較好的方案去做這樣的事情.最近發現一些人的blog上面可以放上美麗的source code 還有行數. 就研究了一下,發現一個免費的javascript + css 的方式 dp.SyntaxHighlighter.
不過他在google blog上面會有問題, 所有繼續找下去. dp.SyntaxHighlighter在google中的問題講到如何解決這樣的問題. 他也改寫了原來的java script來符合他找到的解決方案.

修改步驟:
1. download allcolor.js, shCore.blogger.js,SyntaxHighlighter.css
2. 找個地方放這三個檔案, 既然已經有google account 就去申請google page 放這三個檔案吧.
3. 修改google blog 網頁設定 [範本-修改HTML]


<head>
<link href='http://longtai.tw.googlepages.com/SyntaxHighlighter.css' rel='stylesheet' type='text/css'/>
.....
</body>
<script class='javascript' src='http://longtai.tw.googlepages.com/shCore.blogger.js'>
<script class='javascript' src='http://longtai.tw.googlepages.com/allcolor.js'>

4. 在blog文章中加入 pre tag , 將source code 放在pre tag中.

 
  <pre name="code" class="${language}:${displaymode}">
   ${language} 想要顯示的語言模式. 
   ${displaymode}
   1. firstline[num]: num 為起始的行數.
   2. expandcode: 摺疊代碼
   3. showcloumns: 顯示行號
   4. nogutter: 隱藏行號

2 則留言:

抗剪強度Zero2010年4月29日晚上10:22
你好，
allcolor.js和SyntaxHighlighter.css都沒法下載了
可以放你自己google page的連結嗎？
謝謝
回覆刪除
回覆
長尾巴的魚2010年4月29日晚上11:19
已經改過下載點了 ....
本來想說要因該要尊重作者. 要把原始連結放放去.
沒想到, 原作者居然把link 移除了..
回覆刪除
回覆

新增留言