上個月介紹了 ShoutMix、Cbox 兩個留言板插件~ (觀看教學)

較早前又介紹了 meebo me、Plugoo 兩個聊天插件~ (觀看教學)

現在應該輪到聊天室插件登場了~ ^^
 

說到聊天室, 相信大家都應該不會陌生, 它絕對是早期互聯網上其中一項最為普遍的交友工具, 甚至直至各 IM (Instant Messenger) 軟件已經相當盛行的今日, 網上在線的聊天室仍然是不少人聚腳之處, 可見聊天室依然很受歡迎~

既然如此, 夜衫衫就少說話多做事, 立即介紹以下兩個聊天室插件, 分別是 Gabbly 及 Chatango, 全都適合在 Windows Live Spaces 上使用。

當然, 要在 Windows Live Spaces 上使用這些聊天室插件, 各位必須在 Space 內, 最少加入 HTML Sandbox 或 Sandbox 這兩個 gadget 其中一個。

在開始教學教程前, 還是按照已往一樣, 先說明一些基本條件:

兩個聊天室插件介紹:

Gabbly - 一個在去年, 2006 年  3 月才誕生的聊天室服務網站, 因為有著優越的功能, 加上安裝過程簡單, 不用半年時間就已經傳遍世界, 成為不少 Blogger 或個人網頁的指定聊天室插件。直至今日, 官方 Gabbly 網頁首頁, 已有超過 20 種不同的語言選擇; 亦因為 Gabbly 的各項優點, 加上高度支援繁簡體中文, 所以 Gabbly 在國內及台灣的首頁, 已有「蓋不理」這個中文名稱, 可見 Gabbly 在華人的社會中十分受歡迎。另外, 提供以 RSS 方式讀取留言也是 Gabbly 特色之一。
http://home.gabbly.com/index.jsp?l=zh&c=tw

Chatango - 一個原本和 meebo me 非常相似的聊天插件, Chatango 最特别之處, 是你的訪客可以透過網頁, 即時和你對話 (你必須先登入網站), 這情況就好像 meebo me 配合 meebo 同時使用一樣 (這概念近來真的非常流行); 不過, 自去年 Chatango 更新後, 已發展成一個聊天室服務網站, 容許用戶在 Blog 中加入真正的聊天室插件, 從此大受歡迎; Chatango 高度支援繁簡體中文, 亦高度容許用戶自定義介面, 以聊天室來說, Chatango 在功能上稱得上應有盡有, 唯獨缺欠在線訪客列表, 稍為有點美中不足。(夜衫衫真不明白為何 Chatango 欠缺這個重要功能!)
http://chatango.com/

Gabbly 及 Chatango 兩者互相比較
	Gabbly	Chatango
介面設計	Gabbly 介面	Chatango 介面
優點	1. 擁有在線訪客清單列表	1. 超豐富自定義介面設定
	2. 提供以 RSS 方式讀取留言	2. 付帶 4 個功能, 分別是删除留言、俏俏話功能、封銷某人及加入或刪除 Moderators (副版主)
		3. 支持標題及暱稱輸入符號
缺點	1. 介面設定選項較少	1. 欠缺在線訪客清單列表
	2. 欠缺一般聊天室付帶功能

1. 先到 Gabbly 官方網站 - http://home.gabbly.com/index.jsp?l=zh&c=tw, 按一下「Login」(圖1)。

(圖1)

2. 然後按一下「Register Now」登記帳號 (圖2)。

(圖2)

3. 請根據指示, 填上帳號資訊, 然後按一下「submit」按扭 (圖3)。
PS: 帳號名稱就是將來你在聊天室上所顯示的名稱, 一經設定, 將無法更改。

(圖3)

4. 然後你會收到一封由 Gabbly 官方網站寄出的確認電子郵件, 在這電郵內, 會有一個啟動帳號連結, 請點選這連結 (圖4)。

(圖4)

5. 點選連結後, 會跳出網頁並顯示你的帳號已被啟動, 然後請點選「Gabbly」連結返回 Gabbly 首頁 (圖5)。

(圖5)

6. 這時候你已成功申請 Gabbly 帳號, 但先別心急, 各位可以回到 Gabbly 首頁, 再次按一下「Login」(圖6), 設定上載你的個人頭像。

(圖6)

7. 然後按一下「Edit Profile and Avatar」登記帳號 (圖7)。

(圖7)

8. 輸入你的帳號名稱及密碼, 然後按一下「Submit」按扭 (圖8)。

(圖8)

9. 在這裡, 除了帳號名稱外, 你可以更改一切個人資訊, 如要上載你的個人頭像, 請按下「Change Avatar」, 當完成設定後, 按一下「Submit」按扭即可儲存修改 (圖9)。

(圖9)

10. 回到 Gabbly 首頁, 我們可以準備一下獲取 Gabbly 的代碼, 按下「網站安裝」(圖10), 然後根據指示, 設定你的 Gabbly 介面及生成代碼, 代碼生成後, 請將欄位內的整段代碼複製出來; 另外, 各位在這裡, 亦可以同時生成 gabbers 貼紙的代碼, 這個 gabbers 貼紙可以即時顯示你的聊天室的在線人數。

(圖10)

11. 將複製出來的代碼, 放入 HTML Sandbox 或 Sandbox 隨便一個 gadget 內 (圖11), 再按一下「Save」按扭。

(圖11)

12. 預覽一下結果, 發現 Gabbly 插件已成功安裝在你的 Space 上了 (圖12), 你可以測試一下 Gabbly 聊天室的各項功能。

(圖12)

13. 在聊天室中, 任何人也可以更改暱稱及發言, 如果你有上載你的個人頭像, 可以按「Login」登入 (圖13), 然後輸入你的帳號名稱及密碼, 登入後即可看到在線列表中, 個人頭像會顯示在你的名稱旁邊 (圖14)。

(圖13)

(圖14)

Gabbly 擁有在線顯示訪客清單, 基本上就是聊天室的基本功能, 而且用戶可以自行選擇隱藏這個清單, 算是個非常貼心的功能~ 在其他功能上, Gabbly 仍有很多可以改善的地方, 只好期待 Gabbly 盡快更新加入更多功能。
 

1. 夜衫衫也提過了, Chatango 原先只是個和 meebo me 非常相似的聊天插件, 直到後來系統更新, 才容許用戶加入直正的聊天室插件, 因此, 不論各位希望使用那一種服務, 也須要先申請一個 Chatango 帳號; 所以, 請到 Chatango 官方網站 - http://chatango.com/, 按一下「sign up」(圖1)。

(圖2)

2. 現在你可以慢慢設定你的 Chatango 聊天插件介面, 可自定義的選項很多, 包括背景顏色、介面大小及各種不同文字的顯示顏色等等, 亦可右下方即時預覽效果, 完成設定後, 請按一下「Next ＞＞」按扭 (圖3)。

(圖3)

4. 輪入你的電郵地址、設定密碼及標題, 然後按一下「Sign Up」按扭 (圖4)。
PS: screen name 是唯一的, 也就是每位用戶的帳號名稱, 因為不支持中文 screen name, 所以各位設定時須多加留意, 在以下的示範中, 夜衫衫用了 "camuschu" 作為 screen name。

(圖4)

5. 這時候, 網頁會顯示你的 Chatango 聊天插件代碼 (注意啊! 這並非聊天室插件代碼!), 請將欄位內的代碼複製出來 (圖5)。
PS: 同時在這頁面中, 也顯示了 Chatango 自家開發的軟件 - MessageCatcher, 安裝後, 即使你關閉網頁, 其他人亦會看到你仍然在線, 各位有興趣可自行下載及安裝。

(圖5)

6. 將複製出來的代碼, 先作出少許修改...

為甚麼要修改? 因為 Chatango 的透明效果問題! (這一方面, 它和 meebo me 真的非常相似!)

夜衫衫在這裡有必要再說明一下:

如果各位將複製出來的整段代碼, 直接放入 HTML Sandbox 或 Sandbox 隨便一個 gadget 內, Chatango 是無法支持輸入中文的, 要解決這問題, 必須要修改代碼, 修改方法就是在原代碼內, 將 wmode="transparent" 這一句刪除。例如, 以下是夜衫衫申請後所得到的原代碼:

＜div＞＜embed src="http://camuschu.chatango.com/flash/mini.swf" bgcolor="#FFFFFF" width="140" height="150" wmode="transparent" type="application/x-shockwave-flash" flashvars="k=1"/＞＜br＞＜a href="http://chatango.com/signupmini"＞＜img src="http://chatango.com/images/t.gif" border=0＞＜/a＞＜/div＞

修改後為:

PS: 請將代碼內全形的 ＜＞ 符號改成半形的 <> 符號。

將修改後的代碼, 放入 HTML Sandbox 或 Sandbox 隨便一個 gadget 內, 再按一下「Save」按扭 (圖6)。

(圖6)

7. 預覽一下結果, 發現 Chatango 聊天插件已成功安裝在你的 Space 上了 (圖7), 不過, 這時候你還要登入 Chatango 網站 - http://chatango.com/, 才可以和你的訪客直接對話, 否則, 你的訪客只會看到如下圖一般, 你的在線狀態顯示為離線。為了測試一下這個 Chatango 聊天插件, 各位必須配合 Chatango 服務才可, 所以請先別關閉預覽中的網頁, 用你的瀏覽器, 多開一個網頁到 Chatango 網站 - http://chatango.com/, 然後登入你的 Chatango 帳號。

(圖7)

8. 登入 Chatango 網站後 (圖8), 各位已可看到在左邊的對話欄位上, 顯示「Waiting for incoming messages」訊息, 代表只要你的訪客在 Chatango 聊天插件上輸入訊息, 你可以即時在這裡和他對話。另外, 各位亦可以在這裡按下「Edit Profile」按扭, 設定你的個人資訊及上載個人圖像。

(圖8)

9. 這時候你可以模疑一下有訪客正在瀏覽你的 Space, 並在 Chatango 聊天插件上輸入訊息 (圖9)。

(圖9)

10. 回到 Chatango 網站網頁, 已看到剛才所發出的訊息, 同時也試試回覆訊息 (圖10)~

(圖10)

11. 回到預覽中的網頁, 看到回覆的訊息已成功顯示 (圖11), 就是這樣, Chatango 聊天插件已可說大功告成!
夜衫衫: 「本節教學完畢......」
甚麼? 那麽 Chatango 聊天室插件如何安裝? 又偷懶!?
夜衫衫:  「別心急, 接下來就說明如何安裝 Chatango 聊天室插件...(差點忘了)」

(圖11)

12. 回到 Chatango 頁首 (要先登入), 就會看到這個 Chatango 新功能 - 聊天室插件的廣告 (圖12), 點擊一下即可進行設置介面。

(圖12)

13. 看到下面的超豐富的設定選項 (圖13), 相信夜衫衫也不用多說明了, Chatango 聊天室插件除了可以容許設定一般介面顏色、字體大小外, 更可在介面上輸入不同的語句, 所有修改可以即時預覽效果, 唯一要注意的, 就是各位必須設立一個和別人不同的 Group URL (二級域名)。設定完成後, 請按一下「Continue」接扭。
PS: Group Name、Group URL、Group Description、Group Location 這四個選項, 一經確定, 在短期內將無法改變! 所以請小心填寫。

(圖13)

14. 這時候, 網頁會顯示你的 Chatango 聊天室插件代碼, 請將欄位內的代碼複製出來 (圖14)。

(圖14)

15. 將複製出來的代碼, 放入 HTML Sandbox 或 Sandbox 隨便一個 gadget 內, 再按一下「Save」按扭 (圖15)。
PS: 這次不用修改代碼了~

(圖15)

16. 預覽一下結果, 發現 Chatango 聊天室插件已成功安裝在你的 Space 上了 (圖16), 你的訪客已經可以互相聊天, 如果有上載你的個人頭像, 圖片會顯示在名字的旁邊。
PS: Chatango 是少數支持暱稱輸入符號的聊天室, 愛聊天的朋友一定喜歡!

(圖16)

最後, 提提大家, 要更改 Chatango 聊天室的介面設定, 按下介面上「Steal this」連結即可, 而 Chatango 聊天室插件還有其他 4 個主要功能, 分別是删除留言、俏俏話功能、封銷某人及加入或刪除 Moderators (副版主), 這絕對是聊天室內非常實用的功能, 建議大家一試!

一連兩個聊天室插件已經介紹完畢, 遇上問題的話, 迎歡留言。
 

如果要轉載這篇文章, 請使用「引用通告」功能, 或指明出處, 感謝。
不清楚如何使用「引用通告」功能, 可參考這裡。