雖然自從 Wordpress 2.x 開始，就內建了 TinyMCE 這套 WYSIWYG 的編輯器，但因為之前使用 EditorMonkey 裡面的 FCKeditor 功能實在強大，又能依據我的需要進行 customization，因此我仍然還是使用 EditorMonkey。可是，EditorMonkey 內附的 FCKeditor 是 2.2 版，已經很舊了，在使用的過程中，也一再地發現某些 bug，甚至培養出了迴避這些 bug 的編輯行為。
是故，我一直在思考著，是不是什麼時候，來升級一下。就在編寫 dprintf() 系列文章的過程中，實在是受不了了舊版 FCKeditor 的一些 bug 的情況下，再加上 FCKeditor 就在 2007-10-10，剛剛釋出了 2.5 Beta 版，所以一不小心，就把 editormonkey 拔掉，搞出了個 FCKeditor 2.5.x 的 wordpress plug-in 來。
當然，我並沒有那麼厲害，能夠無中生有的憑空造出一個 plug-in 來，主要還是參考了 Dean's FCKEditor For Wordpress，這是官方的 wordpress plugin directory 裡用 fckeditor 當關鍵字，所可以找到的唯一一套真正的 fckeditor [...]
(舊文)
看到 Max.Taiwan 的這篇《sitemeter加入第三方連結》，我決定也把 SiteMeter 也關掉。可惜這陣子渡蜜月去了，所以拖了十來天才有反應，在此向本站的訪客致歉。
雖然說在 SiteMeter 的 Privacy Statement 裡面有這麼一段：
Third Party Advertisements
The advertisements appearing on our website from time to time are provided by a variety of our third party advertising partners. We only share website usage information about our users with reputable third party advertisers for the sole purpose of better targeting our website [...]
看到這篇《網頁程式碼美化程式 Google Code Prettify》的介紹，我也試裝了一下。果然所有程式碼的列表，自動有了 syntax highlighting。
Google Code Prettify 的特色是，用的時候不需要指定語言，會自動偵測。我們「唯三」需要做的，就是：
在 <header> 引入 google-code-prettify 的 css 與 javascript 檔。
將你要做 syntax highlighting 的程式碼，寫在 <pre> 裡，並賦予 prettyprint 的 CSS class。
在文件全部載入之後，呼叫 prettyPrint() 函式。
由於我有一堆文章，已經把程式碼放在 <pre>，使用 code 這個 CSS class 標示，因此，我需要做一些額外的處理，把這些 <pre class="code"> 找出來，再多加上 prettyprint 的 CSS class。
將 google-code-prettify 抓下來解開後[1]，會有兩個檔：prettify.css 與 prettify.js，一起放到 theme 目錄下即可。因為 Y!UI 很好用，所以我就偷懶直接依靠 Y!UI。修改 wordpress 佈景主題的 header.php 檔[2]，在 </head> [...]
最近許多 blog 都裝了 Snap.com 的 Snap Preview Anywhere™。效果雖然很炫，但超大的 pop-up preview window，常常擋住我閱讀的視線，並對一些操作，如取 link url，造成影響。所以我決定自力救濟，擋掉 Snap Preview Anywhere™，讓這些不請自來，影響閱讀的大 pop-up 失去效用。
作法其實很簡單，用 AdBlock 或 AdBlock Plus 擋掉該 javascript 的 URL 即可。加一條 rule 如下：
http://spa.snap.com/snap_preview_anywhere.js?*
測了幾個有使用的網站，網站的其他功能，一切正常，只有不再 pop-up 惱人的 preview 視窗而已。
2006-12-21 補充：
Angus 的這篇《令 Snap Preview 在點擊時才出現預覽》，介紹了一個方法，讓使用 Snap Preview Anywhere™ 的 blogger，可以保留 Snap Preview Anywhere™ 的特效，又不至於太惱人。
最近對 JeffHung.Blog 動了一些手術，裝了在《今日連結 (2006-09-20)》時看到的 Sandbox 的這套 theme，並予以改造，準備將外觀改回原來的樣子。Sandbox 是一個 semantic-rich 的 wordpress theme，其設計極端注重語意的保留，是一個很好的，設計自己的佈景主題的起點。
對於 blog 的佈景主題，之前換成 beeblebrox 布景時，我就已經有了基本的想法，最主要的就是要能夠讓我得以清晰的擺放程式碼在文章裡。這當然是因為，實在是文筆不好，只好多填些程式碼充數的關係。再又經過一段時間的觀察與沈澱之後，想法多了一些，以下簡單條列於下，算是再次整理：
在版面配置上，如果有邊欄 (side-bar, side-panel, ... what ever) 的話，必須要放在左邊。這是因為程式碼以及我會使用到的語言，方向都是由左至右的 (left-to-right)，而程式碼有時候又有「不可換行」的特性，當有這樣子的狀況發生時，版面就會被撐大，若邊欄放在右邊，在「由左至右」以及「不可換行」兩個因素的限制之下，邊欄就會對本文的閱讀造成影響。
在版面配置上，本文區塊應當要是 fluid，也就是會隨著瀏覽器的大小而變動。理由正是由於上述程式碼有「不可換行」的特性之故。當版面被撐大時，fluid 的版面配置，就不會讓版面受到破壞。
本文字體大小必須是瀏覽器預設的大小，這是預設閱讀起來最舒適的字體大小。Gslin 在這篇《字形的問題》有聊到相關的考量。以前小時候，總喜歡在一個頁面裡，塞下越多的資訊越好。但現在老了，眼力不行了，所以字還是大一點，看起來比較舒適。
非本文的內容，在樣式上，應該盡可能地不喧賓奪主。這可以用較小的字體，或較淺的前景色來達成。尤其是在邊欄放在左邊的情形下，邊欄的內容更是容易讓使用者分心，因此適度的淡化處理，是必須的。
邊欄存在的目的，應該只是提醒使用者，「還有這些東西可以看」，而不是直接把內容呈現給使用者，內含真正內容的邊欄，只會使使用者分心。因此，放在邊欄的 recent-comments 與 recent-trackbacks 等，應該要只放連結與標題就好，毋需列出部份內容。
內頁的 HTML <title> 必須包含文章標題，考量到 tab browsing 時，tab width 通常不寬，因此文章標題應該置於 blog 名稱之前，如：「Sandbox, look.urs, and blogging frequency [JeffHung.Blog]」。
Search form 應該擺在越上面越好。我通常會擺在 header 的右方。Searching 已經超越 surfing 成為現今主流的瀏覽方式，所以應該放在最立即所得，但又不影響主體的地方，就好像 firefox 的 search [...]
前幾天我在裝「Did You Pass Math?」的時候，其實也一併裝了「footnotes」，不過這個套件可以討論的東西比較多，所以遲至現在才發表。
我一直認為，寫文章用 HTML 實在是用錯了格式。如果可以的話，我希望 blog 裡的文章，是使用 DocBook 格式為其原始格式，然後再經過某種機制，好比說 XSLT，轉換成 HTML 在 blog 裡呈現。理想狀況是，blog 的後台，內建 Web-based WYSIWYG DocBook editor。但這是理想，在現實上，連 stand-alone 的版本都沒有了[1]，遑論 blog 後台的整合。因此，遷就於工具的問題，也只好將就[2]。
是故，退而求其次，我希望至少能夠在 (X)HTML 裡，呈現出我常用的文章樣式。對偏向技術性文章的我來說，最重要的就是 program listing 與 inline code 的呈現了。這個我已經藉由 FCKEditor 可自訂 CSS 的功能達到[3]，若需要更進一步的 syntax coloring 或 line numbering 的花俏功能，我認為直接在 client 端藉由 javascript 達成[4]即可。
而第二常用的文章樣式，則是 footnote，我個人喜歡使用論文 reference 的寫法，於指涉處與註解處，皆使用方刮號 ( [ 和 ] ) 包裹註解編號，並加上超連結在兩者之間跳躍。這篇《升級到 [...]
寫程式的時候，通常我們可以利用 printf() 之類的函式，把一些程式內部的資料印出來，以追蹤程式的運行狀態。以程式設計的術語來說，這個叫做 logging。對於有 console 可以使用的程式來說，printf() 通常便已足敷使用，但若寫的是視窗程式之類沒有 console 的程式，就很麻煩，因為用以替代的 MessageBox() 可以顯示的資料不多[1]，又沒辦法將訊息內容複製到剪貼簿裡。當「簡易法」無法奏效的這個時候，就必須啟用「真正的」logging 機制，把 logging 確實當作一個程式運作所必須的 component 來處理。
SHELL> find /usr/ports/devel -type d -name 'log4*' -maxdepth 1
/usr/ports/devel/log4c
/usr/ports/devel/log4cpp
/usr/ports/devel/log4j
/usr/ports/devel/log4cplus
/usr/ports/devel/log4cxx
/usr/ports/devel/log4sh
如上所示，常見的程式語言，我們有 log4* 系列的函式庫可以用，log4j 是其濫觴。對於商業軟體開發工具而言，也通常會有其對應的 logging solution 可用。
言歸正傳，最近我在用 AJAX 寫一個加強 trac 的程式時，發現 logging 之於 javascript 寫作，也很重要，因為 alert() 就跟 MessageBox() 一樣地不方便。安裝 debugger 之類的網頁整合開發環境，是個不錯的辦法。不過，其實我們也可以自己來。
簡單講，logging 其實就是把指定的資料，送到某處顯示，以便於當下或事後檢視。因此，logging 基本上必須有「傳送」與「顯示」這兩個步驟，若要做的好一點的話，可以再加個「記錄」，以便於事後檢視。因此，不考慮進階的「記錄」功能的話，要在 javascript 裡做 logging，其實很簡單，基本把握「傳送」與「顯示」兩原則即可：
function JSLogPrint(msg, tag)
{
var JSLogEnabled = document.JSLogEnabled;
if (JSLogEnabled [...]
由於內建了 WYSIWYG 的 HTML editor，Wordpress 2.0.* 的 posting bookmarklet 也可以直接以 WYSIWYG 的形式編輯文章了 (之前的 WYSIWYG 靠的是 plug-in，posting bookmarklet 沒有 plug 到)。
但是，官方的 posting bookmarklet 會取代掉目前的網頁，這樣在編輯文章時很麻煩，沒辦法回來參照原文編寫。所以只好下手改改這個 posting bookmarklet。基本上關鍵在這裡 (其中，Q 是目前被選取的文字，如果有的話)：
location.href
= 'http://www.jeffhung.idv.tw/blog/wp-admin/post.php?text='
+ encodeURIComponent(Q)
+ '&popupurl='
+ encodeURIComponent(location.href)
+ '&popuptitle='
+ encodeURIComponent(document.title);
因為是更改 location.href 來啟動 blog 編輯，所以目前頁面會被替換掉，換成 window.open() 開新視窗，應該就可以了。所以我把這段改成這樣：
window.open(
'http://www.jeffhung.idv.tw/blog/wp-admin/post.php?text='
+ encodeURIComponent(Q)
+ '&popupurl='
+ encodeURIComponent(location.href)
+ '&popuptitle='
+ encodeURIComponent(document.title)
);
卻沒想到，雖然新的 blog 編輯視窗有正確出現了，但原來的頁面卻被切換成這樣：
[object Window]
研究了網路上其他的 bookmarklet 的寫法，才恍然大悟，如果 bookmarklet 的最後一個 statement 有「值」的話，browser (firefox) 就會把這個值顯示在頁面上。所以在最後加一個 [...]
要開始來在 ADE 裡寫點 javascript 了，第一個碰到的問題就是，在 javascript 裡怎麼做 include guard？搜尋 Google 沒找到答案，只好自己來。靠《JavaScript - a free online quick reference by VisiBone》找到這條語法：
var u; /* not assigned */ assert(typeof(u) == "undefined"); /* not defined */ assert(typeof(x) == "undefined");
正好適合來做 javascript 版的 include guard。為了測試，寫了一個 js_inc_guard.js 檔如下：
if (typeof(JS_INC_GUARD_JS_INCLUDED) == "undefined") { var JS_INC_GUARD_JS_INCLUDED [...]
來追一下 Ajax 技術吧。:-) 研究分析：
Flickr: From Flash to Ajax
參考資料：
Ajax: A New Approach to Web Applications - 介紹 Ajax 的文章。
BackBase－Axaj-based RIA - 自從 Flickr 棄 Flash 而就 Ajax 之後，Ajax 這個詞就紅了起來。其實概念很簡單，不過大環境到最近才成熟。三、四年前的時候，大家就有在幻想這樣的架構，但根本作不出來。因為 browser 彼此之間的相容性太差，與 W3C 標準差別太大，根本很難下手。再加上那時候的 W3C 的標準，也過於陽春，Ajax 需要的一些關鍵技術，也尚未成熟。現在技術成熟了，也許漸漸地市場上就可以看到 Ajax 相關的程式庫甚至 framework 出現了，好比阿修現在推薦的 BackBase 這間公司的產品。
Ajax and FlickrJS - 既然 Flickr 開始用 Ajax 了，當然原本的 Flickr API 就也該有個 [...]
