將Blogger Beta的Label作成Label Cloud

Chagg's 嘴砲日記: 將Blogger Beta的Label作成Label Cloud: "skip to main | skip to sidebar
Chagg's 嘴砲日記

入伍中~數饅頭的日子
Flickr 上的一張相片Flickr 上的一張相片Flickr 上的一張相片Flickr 上的一張相片Flickr 上的一張相片


* 首頁
* 旅遊相簿
* Blogger相關
* Tags
* HEMiDEMi書籤

Site Meter
星期二, 十月 31, 2006
將Blogger Beta的Label作成Label Cloud

關於將Blogger Beta所提供的Label作成Label Cloud
在『Phydeaux3:Code for Beta Blogger Label Cloud』這篇提供了製作Lable Cloud的方法， 其原文教學：http://phy3blog.googlepages.com/Beta-Blogger-Label-Cloud.html

以下為引述其內容：

首先記得先將你的template備份，進入編輯html(Expand Widget Templates不用打勾)，接著在CSS部分加入

/* Label Cloud Styles
----------------------------------------------- */
#labelCloud {text-align:center;font-family:arial,sans-serif;}
#labelCloud .label-cloud li{display:inline;background-image:none !important;padding:0 5px;margin:0;vertical-align:baseline !important;border:0 !important;}
#labelCloud ul{list-style-type:none;margin:0 auto;padding:0;}
#labelCloud a img{border:0;display:inline;margin:0 0 0 3px;padding:0}
#labelCloud a{text-decoration:none}
#labelCloud a:hover{text-decoration:underline}
#labelCloud li a{}
#labelCloud .label-cloud {}
#labelCloud .label-count {padding-left:0.2em;font-size:9px;color:#000}
#labelCloud .label-cloud li:before{content:"" !important}

接著在]]>和之間加入Javscript Code

這段程式碼主要是存放變數的，var lcBlogURL = 'http://YOURBLOG.blogspot.com';這段記得改成你的blog網址。

接著找到這段

用下面的這段取代它

到這裡就可以算完成了。

最後是關於前面變數修改的部份，可以依個人喜好修改

• maxFontSize與minFontSize分別為Label最大與最小的字型size，以px為單位。
• maxColor與maxColor分別為Lable最大與最小的字型顏色，使用的是RGB色碼，不清楚RGB色碼的，可以用色碼轉換器來轉換。
• lcShowCount表示是否顯示label後面的括號文章數量，false為不顯示，true為顯示。

進階教學：

• 將Label Cloud製作成獨立頁面