最近路那搬家到fc2中文版上去,同時新增了可愛的標籤雲球,讓人非常心動阿~~所以今天都在研究怎麼把它搬到pixnet上。在經歷了耍笨、耍笨還有耍笨的過程,我終於成功的把他搬出來啦 TDT
目前測試在blogger、樂多都也都可以用,可是一個比一個麻煩,所以我還是先解說pixnet上如何使用~如果對程式有點概念,懂得觸類旁通的人,應該可以輕易搬到其他地方ˇ
WP-Cumulus是很有名的標籤雲球,不過一開始並不支援中文。後來日本的ajaxblogparts改寫出Amazon タグクラウド套件,我再以這個套件為基礎,配合敗家誌的教學,最後寫出來的。不過因為痞客上面沒有標籤的功能,所以我直接以「分類」來製作並撰寫下面的教學,整個過程完全是土法煉鋼…沒耐心的請不要輕易嘗試 (炸)。 另外,我是第一次寫這種教學,所以看不懂的地方請盡量發問QwQ
以下是使用步驟。
1.準備文字和連結
因為痞客沒有標籤的功能,所以直接以文章分類製作。請先複製文章分類名稱,還有分類的編號。
分類的編號指的是分類網址最後那串數字,以我自己的「推理小說」為例,點下去後跑到這個網址 http://monococcus.pixnet.net/blog/category/822142
最後那串"822142"就是我們所要的數字。
整理完後大概可以得到這樣的表格:
分類文字 | 分類編號 |
推理小說 |
822142 |
華文推理小說 | 1325967 |
blog二三事 | 1326467 |
2.修改程式碼
程式碼:
<script src="http://coccus.myweb.hinet.net/swfobject.js" type="text/javascript"></script><div id="wpcumuluswidgetcontent"><p style="display:none;"> <p><p>WP-Cumulus @ pixnet by <a href="http://monococcus.pixnet.net/blog/">coccus</a> requires Flash Player 9 or better.</p></p></p></div> <script type="text/javascript"> /* 標籤與連結設定 */ var keywords = new Array("推理小說", "華文推理小說", "blog二三事", "", "", "", "", "", "", "", "", "", "", "", ""); /* 請在這裡填入分類文字 */ var keywordlinks = new Array("822142", "1325967", "1326467", "", "", "", "", "", "", "", "", "", "", "", ""); /* 請在這裡填入分類編號 */ var fontcolor = '0x72d000';/* 字體顏色。預設: 0x72d000*/ var tagcloudassociateid = 'monococcus';/* pixnet的ID*/ /* 標籤與連結設定結束 */ var tagstr = '%3Ctags%3E'; for (var j = 0; j < keywords.length; j++){ var taglink = 'http%3A%2F%2F'+ tagcloudassociateid+'.pixnet.net%2Fblog%2Fcategory%2F' + encodeURIComponent(keywordlinks[j]); var tagkeyword = keywords[j]; var fontsize = 18; fontsize = 18 - (j * 0.6); if(tagkeyword.length > 0) tagstr += '%3Ca+href%3D%27' + taglink + '%27class%3D%27tag-link-32%27+title%3D%271+%E4%BB%B6%E3%81%AE%E3%83%88%E3%83%94%E3%83%83%E3%82%AF%27+target%3D%22_blank%22+rel%3D%22tag%22+style%3D%27font-size%3A+' + fontsize + 'pt%3B%27%3E' + tagkeyword + '%3C%2Fa%3E%0A'; } tagstr += '%3C%2Ftags%3E'; var rnumber = Math.floor(Math.random()*9999999);var widget_so = new SWFObject("http://coccus.myweb.hinet.net/tagcloud.swf?r="+rnumber, "tagcloudflash", "190", "200", "9", "#ffffff");widget_so.addParam("wmode", "transparent");widget_so.addParam("allowScriptAccess", "always");widget_so.addVariable("tcolor", fontcolor);widget_so.addVariable("tcolor2", fontcolor);widget_so.addVariable("hicolor", fontcolor);widget_so.addVariable("tspeed", "100");widget_so.addVariable("distr", "true");widget_so.addVariable("mode", "tags");widget_so.addVariable("tagcloud", tagstr);widget_so.write("wpcumuluswidgetcontent"); </script> <noscript>請確定您有開啟javascript的功能</noscript> |
請先複製上面的程式碼,或是點選這裡下載,然後將粉紅色的地方一一修改:
a.分類文字和編號對應填上,如下:
var keywords = new Array("推理小說", "華文推理小說", "blog二三事", "", "", "", "", "", "", "", "", "", "", "", ""); /* 請在這裡填入分類文字 */
var keywordlinks = new Array("822142", "1325967", "1326467", "", "", "", "", "", "", "", "", "", "", "", ""); /* 請在這裡填入分類編號 */
沒有填滿沒關係、只要注意 " 和 , 不要消失、文字和編號有一一對應就好。如果你的標籤非常多,可以繼續擴充~但是版面會很花 XD
b.修改顏色:預設是綠色
c.填入痞客id:請填入自己的id,不然會出錯
3.在管理後台增加欄位:
管理後台 > 側邊欄位設定 > 新增欄位,將剛剛改好的程式碼貼上去。
這樣,就大功告成了!!!
.
看起來不難,不過填入文字和編號的地方很容易出錯,大家請保重(炸)
以上教學,可以轉載、但請保留coccus的名字和coccus的推理空間之連結。
留言列表