Quantcast
Channel: WFU BLOG
Viewing all articles
Browse latest Browse all 784

Blogger「單篇文章瀏覽數」__更新版

$
0
0

(Pic from: psdgraphics.com,freevectorgraphics.org)
舊版「讓Blogger能顯示單篇文章瀏覽數」使用了第三方的服務 OOcharts,由於從 2013/7/22 開始其改為收費服務,曾安裝過舊版的讀者,此功能已經無法再生效。

這次的更新版使用了不同的解決方案,利用 Google 試算表來存取 Google Analytics 的資料,再將文章瀏覽數據從試算表讀到網頁來顯示。這樣的解決方式反而比舊版的存取速度更快(非外部伺服器)、更安全(Google 不會收費)。

效果就像首頁文章右上角、每篇文章右上角、及文末文章資訊區所顯示的文章計數器,而安裝的整個流程請詳讀本文的說明。


一、準備動作

首先必須建立 Google 試算表檔案,請參考「如何將 Google Analytics 數據同步到 Google 試算表」的兩篇系列文,按照以下步驟的流程:

1.「(一) 資料查詢與身份認證」→「三、Google 試算表的 GA 參數實例」→ 這一段的步驟做到建立試算表副本完畢即可,之後的參數說明可暫時略過。

接著完成「四、GA 身份認證 API」的所有動作。

2.「(二)試算表操作」→請完成全部的流程。





二、安裝程式碼

以下的程式碼可放在文章區塊中、任何想顯示文章瀏覽數的位置。不過對於不熟 Blogger 範本內容的讀者,可能會是個難題。如果不清楚想擺什麼位置,建議可參考以下文章──


若曾安裝過舊版請將舊版程式碼全部移除;以下請在範本中欲顯示文章瀏覽數的地方,加入程式碼:


以上 N 行與 P 行為了節省空間,將程式碼壓縮了,如果想瞭解原始碼的話,請下載「這個原始檔」。雖然附檔名為 js,但內容包含 HTML 及 Blogger 語法,所以是不能外連的。


先不要存檔,還有重要參數要改,請見以下行號的說明──

J:這是最重要的參數,請參考「如何將 Google Analytics 數據同步到 Google 試算表__(二)試算表操作」→「三、利用 js 讀取 Google 試算表資料」→ B 點紅色底線字串,請將自己的試算表字串置換此行的綠色字串

以上 J 行為最重要的參數,若無其他需求可直接存檔,可看本站文章右上角及文末資訊區的文章瀏覽數效果,也可按「首頁」或「文章標籤」看效果,讓訪客有參考的依據。


若有其他需求請繼續參考以下行號的修改──

K:藍色圖片網址可改為自訂圖案網址。

L:藍色的數字如改成其他數字,瀏覽數據就會乘以多少。例如改成 1.5 就會乘以 1.5 倍;改成 5 就會乘以 5 倍。至於為何加入這個參數的功能,請參考「Blogger 後台文章瀏覽數與 Google Analytics 數據差別很大的原因

B:這一行裡面 style 裡的參數可自行修改 CSS 樣式,例如想要將位置放在最右邊,可加入 float: right;這樣的參數;而 title 裡面要顯示的字串可自行修改。

B & I:這兩行有同樣的綠色字串 "pv1",如果一篇文章只有一個地方想顯示文章瀏覽數,就不必變更;若有第二個以上的地方想顯示文章瀏覽數,請將這兩個字串改為不同的參數,例如 "pv2",然後再將全部程式碼複製到要顯示的位置即可。



三、小結

這個更新版的安裝設定步驟,其實也是不下於舊版;不過好處是,若是有安裝過舊版,可以非常明顯感受到顯示速度快很多,這就是不依賴外部伺服器或外掛的優點。

若 Blogger 使用了很多外部伺服器的小工具,值得考慮改用原生功能、或是以 Google 試算表為資料庫的工具,可按本站上方導覽列的 "Google試算表應用" 或本站下面的這個標籤來參考:

Viewing all articles
Browse latest Browse all 784

Trending Articles