搞死人的前置作業
前置：申請一個Blogger_如果你有自己的網址可以跳過這步驟，這是為了後續發布的限制
- 點我前往申請Blogger
- 按【建立】，隨意的取個名字後就可以按【開始使用blogger】
- 按【建立新網誌】，
- 取名字然後網址可以測試一個你喜歡的網址然後按【建立網誌】，你就有一個自己的部落格了～
以後只要登入blogger左上角可以選擇網誌，以及檢視網誌 - 左邊選單【設定】>【其他】>【GA分析】填入資源層的ID(UA-xxxxxxxx-x)>去GA設定追蹤網址
前置：申請GA_如果你有自己的網址並且有串連GA可以跳過這步驟，這是為了讓你有資料可以跑
- 點我前往申請GA
- 按【申請】
- 隨意的為帳戶名稱命名一下
- 選擇追蹤【網頁】
- 為資源隨意命名一下，填入【網站網址】並選【https】，選一個【產業類別】（p.s.GA的資料層級最上層是帳戶，帳戶下面有資源，資源下面有資料檢視）
- 按下【建立】，並【同意服務條款】
- 如圖選擇【追蹤資訊】，選【追蹤程式碼】，如果沒有跳出頁面，那就按【左下角齒輪】，中間資源層下面的【追蹤資訊】，選【追蹤程式碼】
- 把追蹤ID(UA-xxxxxxxx-x)填回Blogger【設定】>【GA分析】填入，上面申請一個Blogger的步驟五
- 開一個無痕視窗去blogger前台，同時再開一個頁籤回去GA的首頁（左側邊欄的【首頁】）看有沒有即時資料
搞死人的ClientID及API設定
- 前往設定專案【登入】然後選取地區跟同意Cloud Platform服務條款
-
如果有專案:左上角的GoogleAPIs右邊有【箭頭】可以選取專案。如果沒有專案要先建立專案，按畫面中的【建立】，
簡單的打一個名稱，【機構】選無機構即可
- 左邊側欄先去OAuth同意畫面幫【應用程式名稱】先打上去，已授權網域填入Blogger網域（medicaltw.blogspot.com)要按一下Enter再按儲存，可以重新整理檢查一下是否有加入，一開始做的時候很常沒有授權都要再回來檢查。
- 前往專案憑證頁面或是選取專案以後按左側欄的【憑證】，再選【建立憑證】
選擇建立【網路應用程式】，一樣幫他命名一下，已授權的javascript來源(Authorized JavaScript origins)欄位填入網域（https://medicaltw.blogspot.com）一樣按一下enter就可以按建立了，還是一樣要重新整理檢查一下
- 左上角按【選單icon】>【API和服務】>【資訊主頁】
>按首頁中的【啟用API和服務】
查找【Google Analytics Reporting API】，選取後按啟用
- 回blogger按【新文章】，工具欄按一下【HTML】轉換編輯模式，貼入下面前端程式碼
- 程式碼中的用戶端ID改成第三步驟中用戶端ID，找不到的話，回到資訊主頁按左邊的【憑證】就會看到用戶端ID
- 程式碼中的GA資料檢視層的ID要改成GA資料檢視層的id如圖，或是網址列的最後九碼，例如https://analytics.google.com/analytics/web/provision/#/report-home/a151335600w214200719p205041973最後面的205041973
- 發布文章
- 開新的無痕視窗試試看是否成功，我試了幾次因為有cashe，最後換無痕視窗就成功了。
前端程式碼
<meta name="google-signin-client_id" content="用戶端ID">
<!--等於後面要換成用戶端ID剛剛新增的-->
<meta name="google-signin-scope" content="https://www.googleapis.com/auth/analytics.readonly">
<h1>Hello Analytics Reporting API V4</h1>
<!-- The Sign-in button. This will run `queryReports()` on success. -->
<p class="g-signin2" data-onsuccess="queryReports"></p>
<!-- The API response will be printed here. -->
<textarea cols="80" rows="20" id="query-output"></textarea>
<script>
// VIEW_ID要填GA資料檢視層的id
var VIEW_ID = 'GA資料檢視層的ID';
// Query the API and print the results to the page.
function queryReports() {
gapi.client.request({
path: '/v4/reports:batchGet',
root: 'https://analyticsreporting.googleapis.com/',
method: 'POST',
body: {
reportRequests: [
{
viewId: VIEW_ID,
dateRanges: [
{
startDate: '7daysAgo',
endDate: 'today'
}
],
metrics: [
{
expression: 'ga:sessions'
}
]
}
]
}
}).then(displayResults, console.error.bind(console));
}
function displayResults(response) {
var formattedJson = JSON.stringify(response.result, null, 2);
document.getElementById('query-output').value = formattedJson;
}
</script>
<!-- Load the JavaScript API client and Sign-in library. -->
<script src="https://apis.google.com/js/client:platform.js"></script>
成果展示
登入以後顯示
