2015年3月1日 星期日

Blogger 單篇文章瀏覽數 V2﹍(2) 新版本特點及安裝程式碼

Blogger 單篇文章瀏覽數 V2﹍(2) 新版本特點及安裝程式碼

Wayne Fu 0 A+
既然改了版,V2 程式碼順便改善舊版的某些功能。舊版要在一個頁面、多個位置擺放計數器不太方便,新版的優點為,一篇頁面要在多少個位置擺放計數器都沒有限制,程式彼此間不會打架。

因此裝了 V2 後,如果你熟悉程式碼,只要發揮想像力,可以自己想辦法擴充到其他 Blogger 工具,例如最新文章、熱門文章、相關文章、隨機文章...等等,只要其他能顯示文章的小工具,也能出現文章的瀏覽數。

以下接續「Blogger 單篇文章瀏覽數 V2﹍(1) 取得 Google Analytics 數據」的步驟。



四、讓試算表資料能被讀取


1. 第二個試算表我已經建立好範本,請進入以下網址:


按「檔案」→「建立副本」→「輸入新文件名稱」後,這份試算表副本會出現在自己的 Google Drive 文件,我們稱它為「試算表 B」。


2. 在「試算表 B」主畫面按下「工具」→「指令碼編輯器」



出現上圖後,按下「資源」→「現有專案的啟動程序」

在出現的視窗按下「尚未建立觸發程序,按一下這裡來新增觸發程序。」




如上圖顯示,依序設定為「時間導向」→「小時計時器」→「每隔4小時」

按下「儲存」→ 出現需要授權的畫面 → 按「繼續」→「接受」




3. 回到原來畫面,我們需要設定讀取「試算表 A」的 GA 數據。如上圖,在程式碼的第一行,反白部分的字串,請填入上一篇 →「三、製作試算表資料庫」→ 步驟 1 → 自己的「試算表 A」ID 代號字串。

修改完畢後,按圖中紅框的「儲存」圖示。




4. 接著按下「執行」→「getUrlPv」,看看能否將資料從「試算表 A」的 "sheet1" 複製到「試算表 B」的 "sheet2"。




執行完畢後,回到「試算表 B」主畫面,檢視工作表 "sheet2"有沒有如上圖產生資料。

成功的話,準備將資料發佈到網路上供存取。

按下「檔案」→「發佈到網路」→ 按下「發佈」按鈕




如上圖,紅線標示的字串是最重要的資訊,長得像這樣 "1UpIjRSixVWYlQnrcSceMb3ATRXlRiKqV_CTc03XyHDc",這是試算表的代號,請記下自己的字串,位於 "/d/" ~ "/pubhtml" 之間的所有字串,之後會用到。

到了這裡,如果都成功的話,恭喜你可以自行安裝「單篇文章瀏覽數 V2」了。新版程式碼的費用,可以用轉帳、或「會員中心」的點數支付,然後請用文末的表單與我聯繫,並附上你的部落格網址,會用 email 寄出新版程式碼。轉帳資訊請見這個網頁:




五、安裝程式碼


1. 安裝新版程式碼之前,務必先移除舊版的所有程式碼。

2. 在修改範本之前,如果第一次安裝本站工具的讀者,建議先閱讀「備份範本的訣竅」系列文章。

3. 拿到新版程式碼後,請到後台「範本」→「編輯 HTML」,游標點進範本區塊,按 Ctrl-F 搜尋 </head> 這個字串,找到後在此字串的前一行,插入新版程式碼。以下擷取程式碼的前幾行、需要設定的部分來說明:


B:這一行可參考「引用 jQuery 的注意事項」,若範本中已經安裝過 jQuery,可移除這段內容。

G:紅字參數請改為上面「四、讓試算表資料能被讀取」最後面、自己的試算表代號。

H:藍字參數為圖示的網址,可改為自訂的圖示網址。請勿必保留圖示,因圖示含版權連結。若要移除版權連結請與 WFU 聯繫。


    4. 接著以下程式碼,請放在計數器想要顯示的地方:

    <!-- 單篇文章計數器v2 顯示位置 start -->
    <span class='postPV' expr:data-url='data:post.canonicalUrl'>
    <script>
    (function () {
    var scripts = document.getElementsByTagName("script"),
    thisScript = scripts[scripts.length - 1];
    pvCount.main(thisScript.parentNode);
    } )();
    </script>
    </span>
    <!-- 單篇文章計數器v2 顯示位置 end -->


    如果不清楚要擺放在哪裡,可以參考「Blogger 單篇文章瀏覽數」→「四、擺放位置」



    六、常見 FAQ


    日後若有常見問題,會持續補充在此。

    Q1: 新文章會有無法顯示瀏覽數量的問題?

    Ans: 當 GA 還沒有新文章的數據時,會無法顯示瀏覽數,請等待一段時間,或用他人電腦點擊新文章,讓新文章產生數據。


    Q2: 一開始有顯示瀏覽數,但後來又無法顯示了?

    Ans: 如果確定 sheet2 裡面有數據,但網頁卻無法顯示瀏覽數的話,請檢查一下 sheet2 這個工作表,是否位於試算表中第三個工作表的位置。


    Q3: GA 抓數據的試算表,好像會中斷 "定時抓數據" 的功能?

    Ans: 我也有發現這件事,應該是 Google 試算表的問題。可按以下步驟自行檢驗:
    • 進入試算表 → 看看「GA 數據」這個試算表的更新時間。由於「GA 數據」會每小時自動更新,如果你看到的更新時間,不在一小時內,那就是停止自動更新了。
    • 「GA 數據」停止自動更新時,請進入這個試算表 → 上一篇「Blogger 單篇文章瀏覽數 V2﹍(1) 取得 Google Analytics 數據」→「三、製作試算表資料庫」→ 步驟 7,檢查「Enable reports to run automatically」是否有勾選。
    • WFU 有時發現這裡會被取消勾選,請重新勾選即可。
    • 但是,有時檢查「Enable reports to run automatically」也是有勾選,卻仍然沒更新數據 → 這依然是 Google 後台的問題,那麼我會先取消勾選、儲存,再重新勾選、儲存,強制更新後台設定,通常這樣就可以了。



    七、聯絡表單


    如果以上流程要自行安裝有困難,或是要索取安裝程式碼,請附上你的部落格網址,用下面的表單與我聯繫。

    聯絡表單:




    更多實用工具:
    0 0
    如這篇文章對你有幫助,歡迎「分享」到 FB、「追蹤」粉絲團、「訂閱」最新文章

    沒有留言:

    張貼留言注意事項:

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

    TOP