2012年9月20日

讓 Blogger 側邊欄有個簡易安裝的分頁(TAB)功能__(3) 隨機分頁功能

讓 Blogger 側邊欄有個簡易安裝的分頁(TAB)功能__(3) 隨機分頁功能

Wayne Fu 0 A+
本篇的主題為分頁(TAB)功能的應用:

1. 隨機顯示分頁功能。
2. 特定頁面之下的(隨機)顯示分頁功能。


一、隨機分頁

1. 動機:基本的分頁功能會先顯示 "預設分頁" 的內容,例如右邊側邊欄的「友格動態」為預設顯示的分頁,無論怎麼重新整理,「關注1」、「關注2」是永遠不會先顯示的。

而如果想增加舊文章及新文章的曝光率時,例如右邊側邊欄的「熱門」文章為該分頁群組預設顯示的分頁,想讓「隨機」文章、「最新」文章偶爾跑出來亮相一下,這要怎麼做呢?

只要在程式碼裡面加入亂數功能,讓每次載入頁面時,隨機選取一個分頁當成 "預設分頁",如此「隨機」文章、「最新」文章都有機會成為 "預設分頁"。

2. 安裝程式碼:

請參考「第一篇」的原程式碼,緊接在前兩篇安裝的所有程式碼之後、在 BL 行 </script> 之前插入以下程式碼:


3. 使用說明:

以下行號請參照以上程式碼──

C:請參考第一篇的程式碼 AL~AN 行,將所有 <span> 標籤的 id 名稱置換本行的藍色字串。

D:請參考第一篇的程式碼 AQ~BA 行,將所有 <div> 標籤的 id 名稱置換本行的綠色字串。

以上 C、D 兩行,請根據自己分頁群組的分頁數量,放入一樣數量的 id 名稱,不一定是放入三個 id 名稱。而每個字串必須用雙引號「""」包起來,每個字串之間要用逗號「,」分開,最後一個字串的後面不可以有逗號「,」

E:哪幾個分頁想要加入 "隨機預設顯示分頁",就填入對應的數字,例如 [2,3] 就是代表第二與第三個分頁會隨機成為預設顯示分頁。請注意每個數字需用逗號「,」分開,最後一個數字的後面不可以有逗號「,」

4. 隨機效果:請參考右邊側邊欄的「熱門」、「隨機」..這個分頁群組,以及「最新回應」、「最新推文」這個分頁群組,每次進入網站都會隨機顯示分頁內容。


二、特定頁面顯示特定分頁

1. 動機:以最新文章為例,如果在首頁出現的話,基本上最新文章的內容與首頁的文章是一模一樣的,所以最新文章這個分頁沒有在首頁出現的必要,只需要在文章的頁面出現即可。

2. Blogger 語法:請參考 Abin 的「這篇文章」,提到了 Blogger 各種頁面的判斷方法。而這些 Blogger 語法是無法放在 HTML/Javascript 小工具裡面的,只有 Blogger 範本才看得懂這些語法,因此這部分的語法得安裝在範本,會比較麻煩一些。

3. 安裝程式碼:如果想讓分頁群組在特定頁面顯示特定(隨機)分頁的話,請將本文「一、隨機分頁」的程式碼改用以下的安裝方式 → 到 Blogger 後台 → 範本 → 編輯 HTML → 找到要修改的分頁群組小工具,一般而言開頭會長得類似像下面這個樣子:

<b:widget id='HTML1' locked='false' title='小工具標題' type='HTML'>
<b:includable id='main'>

基本上只要搜尋小工具標題的名稱就會找到了。接者請往下一直捲動,直到找到這個小工具的結尾:

</b:includable>
</b:widget>

請注意看,小心不要眼花了,因為每個小工具的結尾都是長這個樣子,不要找到別的小工具結尾去了。接著請在 </b:includable> 的前一行,插入以下程式碼:


4. 使用說明:

D~E 行請參照上一段隨機分頁的說明。

F、H、J:綠字的這三行是 Blogger 頁面的判斷句,意思是當網頁為「文章頁面」時,執行 G 行;非「文章頁面」時,執行 I 行。代表「文章頁面」的藍字 item 可參考前面的 Abin 網頁替換其他參數。

G:showSet 陣列請填入在文章頁面時,要加入隨機顯示的頁面,填法請參照上一段隨機分頁的說明。

I:showSet 陣列請填入在"非"文章頁面時,要加入隨機顯示的頁面,若只填入一個頁面,就只會顯示該頁面;請注意若只填入一個頁面不要加逗號。

U:在範本中原本的 "<" 符號要換成紅字 "&lt;"。

5. 效果:請參考右邊側邊欄的「熱門」、「隨機」、「最新」..這個分頁群組,只有文章頁面時有機會看到「最新」文章分頁,也就是「熱門」、「隨機」、「最新」三個頁面隨機出現;在非文章頁面時,只有「熱門」、「隨機」兩個頁面隨機出現。


讓 Blogger 側邊欄有個簡易安裝的分頁(TAB)功能」系列標題:
一、安裝 HTML 小工具
二、安裝 Blogger 官方小工具
三、隨機分頁功能
四、各種疑難雜症

➢➢ 快速選單:
0 0
如這篇文章對你有幫助,歡迎「分享」到 FB、「追蹤」粉絲團、「訂閱」最新文章

沒有留言:

張貼留言注意事項:

◎ 勾選「通知我」可收到後續回覆的mail!
◎ 請在相關文章留言,與文章無關的主題可至「Blogger 社團」提問。
◎ 請避免使用 Safari 瀏覽器,否則無法登入 Google 帳號留言(只能匿名留言)!
◎ 提問若無法提供足夠的資訊供判斷,可能會被無視。建議先參考這篇「Blogger 提問技巧及注意事項」。
◎ CSS 相關問題非免費諮詢,建議使用「Chrome 開發人員工具」尋找答案。
◎ 手機版相關問題請參考「Blogger 行動版範本的特質」→「三、行動版範本不一定能執行網頁版工具」;或參考「Blogger 行動版範本修改技巧 」,或本站 Blogger 行動版標籤相關文章。
◎ 非官方範本問題、或貴站為商業網站,請參考「Blogger 免費諮詢 + 付費諮詢
◎ 若是使用官方 RWD 範本,請參考「Blogger 推出全新自適應 RWD 官方範本及佈景主題」→ 不建議對範本進行修改!
◎ 若留言要輸入語法,"<"、">"這兩個符號請用其他符號代替,否則語法會消失!
◎ 為了過濾垃圾留言,所有留言不會即時發佈,請稍待片刻。
◎ 本站「已關閉自刪留言功能」。

TOP