在 Blogger 加入 Recent Comments 的功能

由於這個 blog 復活了以後，有些人來留言了（感謝大家的支持 ^^），所以決定重新把 recent comments（或 latest comments，最新的回應）放回來。

遙遠的以前，Blogger 還沒改版的時候，我用的是 JavaScript 的方法（當時還沒有 Blogger widgets 可以用）；但是即使進步到了現在，Blogger 還是沒有提供現成的 recent comments widget... 要知道，使用 Blogger 這個系統就是考驗 DIY 的功力 XD

Google 了一陣，找到了幾個方案，粗分兩大類：1) 使用 Blogger 的內建功能 2) 使用 JavaScript。

使用 Blogger 的內建功能 Feed widget 最單純，理論上讀取速度是最快的（沒有用到 JavaScript），不過不能顯示文章標題，只能顯示五個 comments，feed 的更新也不夠即時（或許跟 Google Reader 的更新規則類似，冷門的 feed 要三小時才會更新），如果很夯的 blog 可能不夠用。由於我喜歡單純一點，而且對我的 blog 來說，顯示最新的五個 comments 也就夠了（這裡看的人不多嘛 ^^"），所以決定一切從簡，用這個最簡單的方式：

1. 進入 Blogger Dashboard（資訊主頁）> Layout（版面配置）> Page Elements（網頁元素）
2. 點 Add a Gadget（增加小工具）
   
3. 在 Basic（基本）分類中，加入 Feed（資訊提供）這個 gadget
4. 填入 blog comments（回應）的 RSS feed（如果是 blogspot 的話就是 http://xxxxx.blogspot.com/feeds/comments/default）
5. 填入標題（"Recent Comments", "Latest Comments", 或「最新的回應」等等）、顯示項目的個數（最多五個）、是否顯示日期及作者等
6. 按下 SAVE（儲存），搞定！

如果胃口比較大，或是 blog 的 comments 增加速度很快，必需要突破顯示五個 comments 的限制，這時只好使用 JavaScript 來操作了。以下的列表或許有遺漏，不過都是確定可以用的，而且不需要額外找儲存 js 檔案的空間：

• 由 bloggerbuster 所提供的 recent comments widget generator，使用方便而且可以直接藉由 Blogger 的 Add Page Element 加入。雖然設定方便，不過文章標題只能顯示英文，偶爾 comment 內文會消失 。研究了一陣，才發現它的標題加入方式應該是 parse 文章的網址，所以文章的網址如果是英文句子轉換的（如 it-is-a-cat.html），就會被轉換回原標題放入 recent comments 中；但是如果文章原本的標題是中文，網址就只會是 blog-post.html 或 blog-post_12.html 等，就沒有意義了。至於 comment 內文消失的原因…不知道，懶得找 :P 格式大概長這樣：

  On Sep 08 RobinW commented on blog post: “這裡顯示 comment 內文。”

• 由 Chagg 所開發的 Blogger 最新回應功能。據作者所言，程式碼是修改自這篇文章。可以指定 comment 的個數，之後將兩行程式碼放入 HTML/JavaScript widget 即可，顯示上乾淨俐落，功能單純。

  Re: 這裡顯示文章標題與 comment 連結，移上來可以顯示 comment 內文。 by RobinW (Sep 08)

• 由 M 所開發的 Blogger latest comments builder。與上個方案類似（程式碼幾乎一樣），除了可以指定 comment 的個數外，還可以設定是否要顯示日期，同樣將程式碼放入 HTML/JavaScript widget 即可。如果只需要顯示文章標題與超過五個 comments，這兩個方案都挺值得推薦的。格式大概長這樣：

  RobinW 回 這裡顯示文章標題與 comment 連結，移上來可以顯示 comment 內文。 on Sep 08

  這個作者也開發了其他與 Blogger 相關的工具，程式碼放在 Google Code，不過因為上面除了 js 檔案外沒有其他的說明，所以還是直接看他的 blog 就好 ^^"

• 由 LVCHEN 所開發的最新回應外掛 for blogger（安裝頁面），利用了 jQuery 這個 JavaScript library，大概是目前我看到功能最強、最華麗的方案了。功能多而且很美觀，操作很直覺。除此之外，製作過程可以調整的選項非常多，包含了顯示的字串、版面外觀等，甚至還提供了預覽功能，最後的成品也可以直接藉由 Blogger 的 Add Page Element 加入。如果想要華麗（又實用）的版本，選這個方案就對了！格式大概長這樣：

  全部展開 跳至留言

  RobinW 於 文章的標題與連結 留了言 - 2008-09-08
  RobinW 於 文章的標題與連結 留言說:「這裡顯示 comment 內文」 - 2008-09-08

  您正在看留言 1~2，共有 10 則留言
  下一頁

  由於有提供預覽功能，看上面這個 demo 可能也多此一舉吧，去試用看看比較快，或是可以看看作者的 Recent Comments project in Google Code。

  這個作者還有其他的 Blogger Hacks，有興趣可以看看。

整理了那麼多，累死我了 orz 以目前我的 blog 的狀況來看，用單純的就好；等以後事業做得比較大，再用華麗版本 :P

後記：寫這篇文章花了我四個多鐘頭，中間修改了一次，原因是我 google 的時候只用關鍵字「blogger "recent comments"」，跑出來的結果大部分都是舊的，沒想到後來手滑，用關鍵字「blogger 最新回應」搜尋，才找到 JavaScript 段落的後三個方法…當下決定重寫！結果篇幅爆增兩倍多 orz 我想這篇應該就是目前 Blogger Hacks 的 recent comments 方案比較完整的 survey 了吧…（希望沒有遺漏太多東西 ^^"）