用 delicious 書籤做 tag cloud 教學

收到 anaplpe 在偶低CBOX的留言
問說我的標籤雲如何來給他製作
這是本格自2006年九月底成立以來一次收到留言
貓手來給他粉是開心馬上動手回覆
ㄚ又想到反正就是要寫了～就來把它PO一篇
大家來用

delocious 美味書籤
做美美的 TAG CLOUD 吧
其實這標籤雲不是貓手自己寫的程式 (貓手不會寫 XD)
只要用美味書籤提供的 tagrolls 功能
剪剪貼貼一下就可以做出來囉

●條件：您所使用的部落格或網路空間，必須支援自訂"HTML及SCRIPT"功能

住白宮不錯，做白工就不喜歡啦，因為 delicious 的 tagrolls 需要 script 功能，如不網站支援～不如拿做白工的時間出去玩，大家先確認看好免得做白工喔！

●步驟一：申請 美味書籤帳號

已有帳號的朋友這就跳過吧。

●步驟二：登入書籤並把部落格文章或網頁，通通加入美味書籤，並編寫 tag 與書籤簡介

可安裝官方所提供的瀏覽器外掛方便這個步驟
→ firefox extension
→ internet explorer buttons
→ bookmarklet buttons for any browser

加入書籤時，一併編輯每個網頁、文章的簡介與屬性 tag ，您所輸入的 tag ，就是標籤雲上面會顯示的字樣喔！

tag 與 tag 間以"空一格 ( space ) "分隔，但 delicious 書籤 tag 與 tag 間因為是用"空一格"做分隔，所以 tag 所用的文字間只要有空格，就會被分成兩個 tag，即使使用 " bundle tag "的功能，也無法在 tag cloud 上面以"一組字"的方式呈現，這要說對沒用過的朋友來說可能很模糊，請看下文舉例。

例如來說，大帥哥羅勃狄尼諾的英文名字是 Robert De Niro，如果我把大帥哥的英文名字加入當作"一個" tag ，在 delocious 的 tag ，帥哥大名會變成 "Robert"、"De"、"Niro"三個 tag ，而不是 "Robert De Niro"一個 tag ，上有政策下有對策，我的自救辦法是把帥哥的名字以大小寫分開，但消去中間的空隔，拼成"RobertDeNiro"，顯示在 tag cloud 上面看起來比較不會莫名奇妙。

●步驟三：到 delicious 建立 tagrolls 樣式，並取得自動產生的程式碼

到美味書籤登入後，網頁右上方有個 settings 點下到 settings 頁，選擇最右邊的 Blogging 底下第三項 tag rolls ，開始設定自己想要的樣式，一邊設定就可以一邊預覽標籤雲字型大小及顏色與顯示項目喔。

●步驟四：複製程式碼到自己網站的自訂html及script模組工具

完成設定後，在同一頁面左下方 Copy and paste this code into your hypertext: 下，把的框框中的程式碼複製下來，貼到自己網站或部落格中自訂 html、script 的功能控制編輯框裡面，並把 tag cloud 功能框拖到自己喜歡的版面位置上，它可以隨你挑的地方高矮胖瘦(例如本站左側是高瘦版、我的貓手的網頁功能測試站裡的是矮胖版)，薑薑～美美的 tag cloud ，不必自己寫程式就完成啦！

補充：貓手的部落格用的是 blogger beta，之前貼的時候有點卡卡的，tag cloud 下方會顯示不正常(有一行跑不出來)，但貓手很奶油桂花手的亂貼亂試，在某天福至心靈的把程式碼用 <table> </table> 標籤包起來以後(如以下所附的程式碼)，跑不出來的那行乖乖現身，顯示就正常了，每個部落格的支援程度並不一致，其他的部落格或網頁如果遇到差不多的問題不妨試試。

<table>
<script src="http://del.icio.us/feeds/js/tags/xvi?size=10-20;color=87ceeb-ffff66" type="text/javascript"></script>
</table>

●步驟五：維護更新

每次發表文章時，PO完把它加入delicious書籤，就可完成標籤雲的更新囉！