Google Code Prettify
Google Code Prettify是Google Code今日推出的新專案,內含的Javascript和CSS檔案,可以將網頁中出現的程式原始碼以不同顏色區隔並美化,使用方式非常簡單,只需三個步驟:
- 使用者必須先將prettify.css和prettify.js這兩個檔案上傳到自己的機器,並且在網頁開頭預先引入。
- 在網頁的
body標籤內,加上onload="prettyPrint()",使上述的js在網頁載入後便起作用。 - 最後,只要將程式碼放入<pre class=”prettyprint”>…</pre>或<code class=”prettyprint”>…</code>之間,即可得到如上圖一般,以顏色重新標示過的程式碼。
<link href="prettify.css" type="text/css" rel="stylesheet" /> <script type="text/javascript" src="prettify.js"></script>
使用者可以透過編輯prettify.css這個檔案,來修改程式碼的顏色。
目前這支JS可以自動判斷C、Java、Python、Bash、SQL、HTML、XML、CSS、Javascript、Makefiles、Ruby、PHP和Awk等程式語言,也能支援目前的主要瀏覽器(IE 6、Firefox 1.5 & 2和Safari 2.0.4)。
推薦給經常在blog中進行程式碼解說的同好使用:)



24. March 2007 at 00:24
[...] Idea Grapes » Google Code Prettify (tags: css) [...]
8. February 2008 at 23:46
[...] 這次更新WordPress的時候也安裝了這個外掛:SyntaxHighlighter,一樣是speckyboy介紹的。它和之前使用的Google Code Prettify相較之下的優點在於可以顯示行號,並且在Option內還可以作以下項目的設定: [...]
26. March 2008 at 16:34
[...] 從這裡看到的,似乎還有些問題。我原本是用Code Auto Escape,功能陽春但還過得去的plugin。先繼續用Code Auto Escape吧。 [...]