IT邦幫忙上貼文時,有個〔CODE〕的語法,可以把程式碼中的語法給 Highlight 起來,而根據語法、關鍵字變化顏色;希望這樣的功能也能弄在自己的網站上,所以試了這些現成的工具。
thegiive 的文章有關 coderay:
http://lightyror.thegiive.net/2007/05/coderay.html
http://thegiive.javaeye.com/blog/77440
才知道怎麼讓程式碼貼在網頁上,
可以有反白、顏色標示語法的方式;
這個作用稱為 highlight,不曉得中文要怎麼講?
反白?著色?高亮度?
一直不曉得 IT邦幫忙 上的 CODE 的語法,
不曉得是用了什麼相關套件做出來?
只知道是用 javascript + CSS 的方式來呈獻語法,
蠻好奇的,不曉得是不是:SyntaxHighlighter?
以Javascript來顯示是蠻不錯的方式,IT邦幫忙看起來是預設以 C++ 的語法來顯示。
如果不用 Javascript 的方式來顯示,常見的是用 CSS 嵌入到 HTML 中。
而在 ruby 裡原來有此 coderay 可以很快做出來,
上述文章有很好的介紹使用,安裝也容易,
就不再多言。
最近也瀏覽到 ultraviolet 也可以讓程式碼語法有色,
而且還有不同的 themes,所以就拿來試一試:
在 archlinux 的環境下:
gem install ultraviolet
會發生欠缺 oniguruma.h 的字樣,
看一下什麼是 oniguruma
pacman -Ss oniguruma 找沒有,
就到 http://aur.archlinux.org/ 尋找看有無人提供:
http://aur.archlinux.org/packages.php?ID=11586
以非 root 的身份進行以下產生 package 的動作:
#下載 該檔的 PKGBUILD 檔,
#http://aur.archlinux.org/packages/oniguruma/oniguruma/PKGBUILD
#砍掉最後一行 md5sums=...
makepkg -g >> PKGBUILD
makepkg -s
#這樣就做好了其 package,
#再以 root 身份安裝
pacman -U oniguruma-5.9.1-2-i686.pkg.tar.gz
#再 gem install ultraviolet 就可順利安裝。
以 command 的使用方式很簡單,
參閱 http://ultraviolet.rubyforge.org/usage.xhtml
個範例試一下就略可知怎麼用。
可看看 http://ultraviolet.rubyforge.org/themes.xhtml 內建各種的主題顯示。
uv -s ruby -t lazy highlight.rb -h > a.html
就可產生 lazy 主題,並加上 HTML 頭尾的輸出。
但這執行後會找不到其 CSS 檔,
只要執行
uv -c .
一次後,便會在本目錄產生個 css 的目錄,
裡面有各主題的 css 檔,到時把 HTML 的 Header 指到對的位置順利顯示。
在這一篇文章裡:
http://snippets.aktagon.com/snippets/60-Syntax-highlighting-code-with-Ruby-and-Ultraviolet
提供了一個 ruby script,
可以把現有各種的 themes 一次通通畫出來。
透過上述的這些工具,就可以在網頁貼程式碼的時候,
就有較好的顯示方式及辨識度。
看了一下本頁用到的javascript,IT邦是用SyntaxHighlighter沒錯。(版本稍舊就是了)不過一頁用了三十個外部的javascript檔案,好像有點多...
我還在用GeSHi這種
缺點是加重Server的負擔, 以及功能上沒比SyntaxHighlighter好(少了行號顯示, 與Copy到剪貼簿...)
但優點是支援的程式種類比較多種
http://qbnz.com/highlighter/
PHP專用的
用在 MediaWiki的話
有現成的外掛
http://www.mediawiki.org/wiki/Extension:SyntaxHighlight_GeSHi