文章列表+「讚」統計(依標籤排列)

(Pic from: iconfinder.com, iconarchive.com)2016.4.8 公告：因 Google Drive 外連失效，請勿使用本篇的程式碼，請改用新版「Blogger 文章列表極速版﹍(2) 依標籤排列」

自訂安裝篇

如果不需要自訂版面配置，那麼只需要依「簡易安裝」來安裝程式碼即可；而本篇則是列出可以修改版面配置的程式碼位置。

在「簡易安裝」的第一個 js 檔，作用為收集所有要印出的資料，第二個 js 檔則印出文章列表的表格，因此自訂安裝主要是改第二個 js 檔的內容。以下的內容可複製到文書處理軟體，將欲自訂的部分修改完後，依照同樣的步驟：新開一篇文章 → 複製修改後的程式碼貼上 → 存檔即完成。

2013.8.10 公告

由於近日存放在 Google Code 的 js 檔全部被刪除了，本文的外連 js 檔已改放到 Google Drive 空間。曾安裝過本文程式碼的讀者，請修改程式碼中 A 行的 js 檔連結。為了避免日後有其他意外，也建議讀者參考「取代 Google Code 外連 js 檔的選擇__Google Drive」，自行備份 js 檔並上傳到自己的 Google Drive 空間。

1. <script src='https://googledrive.com/host/0BykclfTTti-0SlU3SDg5RUVtNlk/TOC_label_FB_main.js' type='text/javascript'></script>
2. <script type='text/javascript'>
3.  
4. function displayToc2() {
5.   var a = 0;
6.   var b = 0;
7.   var c = 1;
8.   while (b < postTitle.length) {
9.     temp1 = postLabels[b];
10.     document.write("<p/>");
11.     document.write("<p><b><a href='/search/label/" + temp1 + "' target='_blank' style='color: #000060;text-decoration: none;'>" + temp1 + "</a></b></p>")
12.     firsti = a;
13. c = 1
14.     do {   
15.       document.write("<table ><tr valign='top'>");
16.   
17.       document.write("<td width='30px'><span style='float:right;'>"+c+".</span></td><td width='390px'><a href='" + postUrl[a] + "' target='_blank'>" + postTitle[a] + "</a>");
18.       if (postBaru[a] == true) {
19.         document.write(' - <strong><i><span style="color: rgb(255, 0, 0);">New !!</span> </i></strong>')
20.       }
21.       document.write("</td>");
22.  
23.       for (var i=0;i<Collect_FBurl.length;i++){
24.     if(postUrl[a]==Collect_FBurl[i]){
25.   if(Collect_FBlike[i]>99){Collect_FBlike[i]="<span style='color:#3d85c6;'>爆</span>"}
26.       document.write("<td><img src='https://lh6.googleusercontent.com/-Ofxn3Sj1alw/T3Uln9JxIqI/AAAAAAAACes/K3d-PfYQzsE/s51/fb_like_share.png' style='padding:0px; vertical-align:middle;'/>："+Collect_FBlike[i]+"</td>")
27.       break
28.     }
29.       }
30.   
31.   document.write("</tr></table>")
32.       c = c + 1
33.   a = a + 1         
34.     } 
35. while (postLabels[a] == temp1);
36.     b = a;
37.     sortPosts2(firsti, a);
38.     if (b > postTitle.length) {break}
39.   }
40. }
41. displayToc2()
42. </script>

K：印出標籤。

Q：設定文章標題寬度、印出文章標題。

S：顯示最新十篇文章的提示樣式。

Y：預設超過 99 個讚顯示藍爆，以免出現三位數影響版面美觀。

Z：印出預設「讚＋分享按鈕」圖案、"讚"的數目。

以上大略簡單提一下，修改那個部分有問題請再留言。

注意事項：
  A. 貼上程式碼前，注意是否為「HTML」的編輯模式(而非 "撰寫" 的編輯模式)。
  B. 文章設定 → 「選項」 → 「撰寫模式」，注意是否為「解釋輸入的HTML」。

一點小提醒：

新開一篇文章插入大量的 javascript 後，以後若是編輯文章時，一些程式碼會亂掉，因此此類文章最好儲存後不要使用編輯功能。比較好的方法是原程式碼備份，直接在原程式碼編輯，編輯完再貼到文章裡，否則 javascript 的效果通常會失敗的！！