2012年6月1日 星期五

[教學]將 Blogger「標籤」小工具放在導覽列實作

[教學]將 Blogger「標籤」小工具放在導覽列實作

Wayne Fu 0 A+

(Pic from: ulife.vpul.upenn.edu, pre2010.ia.nctu.edu.tw)
其實幾個月前就從自己的網站計數器 histats 發現,連上 WFU BLOG 的網域怎麼有 wayne-fu.blogspot.fr(法國), wayne-fu.blogspot.au(澳洲)等等其他國家,還以為 blogger 為了疏散流量,幫忙複製了世界各地的分站。直到 6/1 發現自己的網域也變成 wayne-fu.blogspot.tw 後,才知道之前真的是想太多,因為現在事情大條了,不但免費分站的幻象被戳破了,而且網站很多功能都失效了。趕緊四處找資料瞭解是怎麼回事。

以下內容為擷取這兩個網頁「Country Specific BlogSpot URLs」、「Why does my blog redirect to a country-specific URL」的重點,及自己的想法、因應對策。


一、Google 的用意

1. 現象:blogger 的網址將根據訪客所在地而變更,就像前言提到的狀況,從不同的國家連上 WFU BLOG,就會顯示相對應的網址結尾。

2. 目的:Google 為了管理網站的內容,以符合各國的審查制度、法律規範,將 blogger 自動轉址後,只要某篇 文章/留言 的內容被檢舉,Goggle 會依據當地規範決定是否移除內容,事後再發訊息通知 作者/留言者。

3. 感想:個人推測這個計畫的遠因大概是 Google 退出大陸的事件,為了避免再次因為言論內容造成的區域性問題。將網址依照區域轉換後,例如一篇在台灣不適當的內容會被刪除,那麼 ABCD.blogspot.tw 這個網址將看不到這篇 文章/留言,但是在 ABCD.blogspot.hk 這個網址仍然可以看到該篇 文章/留言。

4. 延伸應用:我們知道現在開始,只要身在台灣於網址列輸入 ABCD.blogspot.com 就會被自動轉成 ABCD.blogspot.tw;不過若是輸入 ABCD.blogspot.hk、ABCD.blogspot.in 等等其他區域的網址,並不會被轉成 ABCD.blogspot.tw。如此一來,例如想在台灣看到被刪除的文章內容,只要把網址改成其他區域就好了。當然,得先有篇被刪除的內容才能測試這個假設。


二、受影響、不受影響的人

只要是自訂網址的網頁,就不會被 Google 自動轉址;只要非自訂網址,就會被自動轉址。

感想:以後在 Blogger 發表爭議性內容之前,先準備一筆經費買個網址,在公海上 Google 才管不到你!



三、自動轉址產生的問題及對策

會造成的問題,全部都是從真實網址(Canonical URLs)被轉換成區域網址 country code Top Level Domain(ccTLD)所引起:

1. 搜尋引擎問題:這個網頁「Country Specific BlogSpot URLs」建議所有 blogger 第一個要做的動作,是到後台檢查範本中有沒有下面這一行:

<b:include data='blog' name='all-head-content'/>
這一行的作用是定位出網站的真實網址。如果沒有這一行,搜尋引擎機器人將來會定位到錯誤的網址,並且 Facebook 讚、Google +1 都無法找到真實網址來儲存統計數據。

感想:
  A. 這一點是很重要沒錯,不過我相信九成以上的範本都會有這一行程式碼,極少數人會去動到這一行。

  B. 個人推測沒有這一行會影響 SEO 的原因:以後新文章由台灣的訪客點擊,搜尋引擎機器人將流量歸到 ABCD.blogspot.tw 這個網址;如果訪客分散許多不同國家的話,流量會被分散、個別統計到不同國家的網址,對於搜尋引擎的點擊數統計就損失慘大了。但是有這一行程式碼的話,流量統一歸到 ABCD.blogspot.com 這個網址。

  C. 其實最重要的是 Facebook 讚、Google +1 的數據統計,所以沒有這一行的話,如 B 點所述,統計數據就會被分散存到不同網域去了;例如總共 10 個讚,可能有 5 個在 ABCD.blogspot.tw、有 5 個在 ABCD.blogspot.jp,統計數據會被個別計算了。


2. Facebook 外掛工具問題:其實 Facebook 外掛工具的數據、資料,都是依據真實網址 ABCD.blogspot.com 來儲存(前提是範本中有第 1 點的程式碼),並不會儲存到 ABCD.blogspot.tw 這樣的轉址。但是目前的頁面被轉址到 ABCD.blogspot.tw 這個網址後,Facebook 會去資料庫搜尋 ABCD.blogspot.tw 這個網址有幾個讚,結果發現沒有資料(也就是數目為0),所以我們會發現 "讚" 統計資料被歸零了

解決方法:根據「Country Specific BlogSpot URLs」,將 Facebook 外掛工具中的程式碼 data:post.url 都置換成 data:post.canonicalUrl,那麼不管訪客在 ABCD.blogspot.tw 或是 ABCD.blogspot.fr,Facebook 都會去找真實網址 ABCD.blogspot.com 的統計資料,就能讓 "讚" 統計、其他 Facebook 外掛工具的數據正常了。

感想:如果不清楚怎麼改 Facebook 的讚、分享按鈕的程式碼,可參考這一篇「Blogger自訂「讚」按鈕」→「三、自訂「讚」按鈕」


3. Google +1 外掛:不用任何更改,自家產品當然會把後台資料改好。

4. 其他社交外掛工具問題:Country Specific BlogSpot URLs」表示,大部分的其他社交外掛工具儲存數據時,並不會根據真實網址,所以多半會出錯。

解決方法:所以只能找找看安裝的程式碼有沒有 data:post.url 這樣的字串,有的話置換成 data:post.canonicalUrl;另外也要尋找有沒有 data:blog.url 這樣的字串,有的話置換成 data:blog.canonicalUrl

感想:其實很多社交外掛工具會提供不只一種安裝方式,上官網、或 google 一下找找其他的安裝方式,如果有某一種安裝方式是有 data:post.url 或 data:blog.url 字串的話,那就可以依以上的解決方法處理了。如果真的找不到的話,換一個社交外掛吧!

2012.10.8 增補

data:post.canonicalUrl 或 data:blog.canonicalUrl 這兩個參數是用來轉換文章頁面的網址,而如果要轉換部落格首頁網址的話,必須使用 data:blog.canonicalHomepageUrl 這個參數。例如"讚"按鈕如果要統計部落格首頁的"讚"數量(例如本站公佈欄下方那一個),那麼該按鈕的程式碼參數就必須改成 data:blog.canonicalHomepageUrl 才行。

改完之後,無論在哪篇文章的頁面,統計首頁的那個讚按鈕都會顯示首頁的"讚"數量;但如果那個按鈕還是使用 data:post.canonicalUrl 或 data:blog.canonicalUrl 參數的話,那麼顯示出來的"讚"數量,就會隨著文章頁面的不同而變動了(變成統計該文章頁面的"讚"數量了)!

而下面的「5. 其他外掛問題」,如果有外掛需要統計首頁的一些資料,原本使用 "<data:post.canonicalUrl/>" 或 "<data:blog.canonicalUrl/>" 的地方必須改用 "<data:blog.canonicalHomepageUrl/>"。


5. 其他外掛問題:如果有用任何外掛需要讀取資料庫的,或是像 WFU BLOG 一樣把 Google 試算表當資料庫,以前儲存的資料都是用 ABCD.blogspot.com 來當索引,現在就會面臨轉址後,在 ABCD.blogspot.tw 的頁面讀不到真實網址 ABCD.blogspot.com 的索引資料。

2012.8.15 增補

如果安裝了 Blogger 官方提供的「Recent posts」、「Recent comments」小工具,由於 Blogger 轉址的關係可能會失效。解決方法有兩種:

1. 按照下一段「四、不讓 Blogger 轉址的方法」,把網址強制恢復 .com,這是個暫時的權宜之計。

2. 到「Blogger 側邊欄相關工具及技巧 (筆記)」找 Abin 版的最新文章、最新回應來安裝,或是我側邊欄的版本「最新文章+縮圖」、「最新回應+留言者各種身份頭像」。


解決方法:現在知道了原理,所有使用 Google 試算表的程式(例如「推文系統」)都要修改 js 程式碼。原本在儲存的時候都是用 top.location.href 來當索引網址,現在必須修改為 "<data:post.canonicalUrl/>" 或 "<data:blog.canonicalUrl/>";同時讀取資料庫時,也要做同樣的動作,把 top.location.href 改為 "<data:post.canonicalUrl/>" 或 "<data:blog.canonicalUrl/>",這樣就沒問題了。


四、不讓 Blogger 轉址的方法

1. 方法: 如果像我的部落格一樣,為了轉址問題要修改的地方很多,那麼「Google 提供」了 "暫時" 強制 blogger 不要轉址的功能,例如:

首頁:ABCD.blogspot.com/ncr
單篇文章:ABCD.blogspot.com/ncr/EFGH.html

如同以上兩個範例,在網址加上 ncr(/) 以後,就可以不被轉址。請注意,這是"暫時"的,表示過一陣子 Google 就會取消這個功能,所以這陣子該做的動作要趕快完成。

2. 感想:這功能看起來很有用,實際上對於不懂 javascript 的人而言,還真是個自我安慰的方法。自己改網址可以不被轉址,問題是所有的訪客看到的還是轉址後的內容啊!!

3. 應用:如果使用 javascript,將網址用「正規表示式」,將 .tw/.in/.fr 等等網域置換成 .com/ncr(/),這樣任何國家的訪客都可暫時看到不被轉址的內容了。

參考「http://www.technoslab.in/2012/02/blogger-ncr-userscript.html」的正規表示式,我將程式碼精簡優化為以下,請放在範本裡 </head> 前:

<!-- 自動轉址 -->
<script>
(function(){
var url = location.href,
check = url.match(/\.blogspot\.(com\...\/|..\/)/);
if (check) {
location.href = url.replace(check[0], ".blogspot.com\/ncr\/");
}
})()
</script>
<!-- -->

存檔後即可看到效果,使用以上語法後,就可讓網站恢復正常狀態,先正常運作避免讓訪客看到異常現象,再來一個一個解決「四、自動轉址產生的問題」。

2012.9.19 補充

近來發現以上語法在本站有異狀:

1. 也許是 Chrome 版本的問題,在 Chrome 下會發生 .com 與 .tw 無限循環而導致開不了網頁的情形,但在其他瀏覽器則無此情形。

2. 也許是我範本裡的 hack 太多,不曉得哪一段與以上語法衝到,導致第 1 點在 Chrome 下的問題,因為在我其他的所有網站,使用以上語法、用 Chrome 開也是沒有異狀。

3. 結論是:在 Chrome 下,以上語法可能會與目前還找不出的語法相衝,導致在 Chrome 下開不了頁面。但如果你的網站使用 Chrome 沒問題的話,就繼續使用以上語法吧!而在我找出原因之前,只好先恢復 .tw 的網址了。

可以慶幸的是,本站之前受轉址影響的 hack 與外掛,在這段期間已經改完程式碼,所以恢復 .tw 網址已經不受影響了。



Blogger 相關文章:


1. Country Specific BlogSpot URLs
2. Why does my blog redirect to a country-specific URL
3. Blogger NCR UserScript
0 0
如這篇文章對你有幫助,歡迎「分享」到 FB、「追蹤」粉絲團、「訂閱」最新文章
TOP