2013年12月1日 星期日

[教學]Blogger 七種頁面形態判斷語法詳解

[教學]Blogger 七種頁面形態判斷語法詳解

Wayne Fu 0 A+
在這篇「7 Blogger Page Types: Analysis, Code Snippets, Data Matrix」看到了過去「Blogger 頁面判斷式(PageType)的各種應用」沒提過的頁面判斷方式,而且其資料整理得很詳細,只差在部分語法可以精簡一些。

因此本篇用自己的方式來說明、及補充上一篇「Blogger頁面判斷式」不足之處。



一、四種頁面判斷式


Blogger 的頁面判斷式共有四種,而標題 "七種" 是因為在 "index" 這個頁面判斷式,原作者再細分成四種頁面形態,所以總共成為七種頁面判斷的方法。

1. archive:文章封存頁面

這個頁面是指官方小工具「網誌存檔」所產生的頁面,網址結尾為 "年份_月份_01_archive.html" 類似這樣的格式。

<b:if cond='data:blog.pageType == "archive"'>
這裡的程式碼,在文章封存頁面才會執行。
</b:if>

P.S. 請注意──
  • 按下「網誌存檔」的月份時,才會顯示此文章封存頁面。
  • 按下「網誌存檔」的年份時,並非文章封存頁面!請注意網址,顯示的是「二、各種索引頁面」→「4. 較新的文章、較舊的文章頁面」,這是很不一樣的地方。


2. item:文章頁面

文章頁面的網址結尾為 "/年份/月份/文章網址字串.html",類似這樣的格式。

<b:if cond='data:blog.pageType == "item"'>
這裡的程式碼,文章頁面才會執行。
</b:if>


3. static_page:靜態網址頁面

靜態網址頁面是由「網頁」小工具所產生,其網址結尾為 "/p/靜態網址字串.html",類似這樣的格式。

<b:if cond='data:blog.pageType == "static_page"'>
這裡的程式碼,靜態網址頁面才會執行。
</b:if>


4. index:索引頁面

這是最複雜的一種頁面,包含了首頁、標籤、搜尋頁面等情況,因此給予單獨說明。



二、各種索引頁面


<b:if cond='data:blog.pageType == "index"'>
這裡的程式碼,索引頁面才會執行。
</b:if>

當看到以上程式碼時,代表以下四個標題的頁面都會執行。而如果要這四種情境的頁面單獨執行程式碼,請見以下說明。

1. 首頁

首頁也是索引頁面的其中一種,下面是最佳的判斷式語法:

<b:if cond='data:blog.url == data:blog.homepageUrl'>
這裡的程式碼,首頁才會執行。
</b:if>


2. 標籤頁面

按下標籤連結時所產生的頁面,下面是最佳的判斷式語法:

<b:if cond='data:blog.searchLabel'>
這裡的程式碼,標籤頁面才會執行。
</b:if>


3. 搜尋頁面

搜尋頁面必須解釋一下,這是利用「官方導覽列搜尋框」時所產生的頁面,網址會有 "/search?q=搜尋字串" 類似這樣的格式。

下面是最佳的判斷式語法:

<b:if cond='data:blog.searchQuery'>
這裡的程式碼,搜尋頁面才會執行。
</b:if>

可參考「Blogger 最強搜尋框工具」來改造這個搜尋框,有較佳的版面配置、且能快速顯示搜尋結果。



4. 較新的文章、較舊的文章頁面

這種頁面很難簡單解釋,主要有兩類:
  • 從首頁按下「較舊的文章」之後所產生的頁面,而不是其他諸如 "標籤頁面"、"搜尋頁面" 、"文章頁面" 等所產生的「較舊的文章」頁面。
  • 按下「網誌存檔」小工具的年份時,所產生的頁面。

此類頁面的網址會有 "/search?密密麻麻的參數" 類似這樣的格式。它跟「3. 搜尋頁面」很類似,網址都有 "search?" 字串,但不同點是網址不會有 "q=搜尋字串" 這樣的格式

我目前還想不出有什麼情境,要為這樣的頁面寫特別的程式,不過還是列出這種頁面的判斷式語法供參考:

<b:if cond='data:blog.pageType == "index"'>
<b:if cond='data:blog.searchQuery == ""'>
<b:if cond='data:blog.searchLabel == ""'>
<b:if cond='data:blog.url != data:blog.homepageUrl'>
這裡的程式碼,較新的文章、較舊的文章頁面才會執行。
</b:if>
</b:if>
</b:if>
</b:if>

說真的,程式碼又臭又長,似乎也沒有實用性,希望哪天能幫它找到應用方式。



三、注意事項


介紹完所有的判斷頁面語法後,讀者需要小心的是,這些都是屬於「Blogger 自創的語法」,不是所有地方都能執行,請注意以下:

1. 不可放在「HTML/Javascript 小工具」之中,因為這不是 html 也不是 js 語法,是無法執行的。

2. 不是範本中所有位置都能執行,可放在 <head></head> 的區間。

3. 如果放在 <body></body> 之間的話,必須注意是否擺放到任何小工具的區間,請務必參考「Blogger 範本__(一)各種註解方式及區塊的修改」→「二、Blogger 各區塊的語法格式」→「2. 語法結構」,語法只能放在紅色字串擺放的位置。


更多 Blogger 判斷式說明:
0 0
如這篇文章對你有幫助,歡迎「分享」到 FB、「追蹤」粉絲團、「訂閱」最新文章

沒有留言:

張貼留言注意事項:

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

TOP