如何整合 Amplitude 與 Google Data Studio，分析 WordPress 網站數據

結合 Google Tag Manager 與 Google 試算表，任何人都能輕鬆零成本入門網站數據分析

最近做了一個 Side Project，產品本身是用 WordPress 建立，且已經有近千人的使用者數量，因此開始想要進行數據分析。而我在這個團隊裡就是負責建立產品數據團隊的成員，並基於過往經驗決定使用 Amplitude 和 Google Analytics（GA）作為資料庫以外的數據源。同時為了讓其他單位的成員也能看到相關維運數據，因此決定使用 Google Data Studio 建立數據儀表板（Dashboard），目標是希望能夠將流程自動化，減少溝通與維運成本。

Ps. Data Studio 目前已經更名為 Looker Studio

以下列出整個流程的大架構，可能有些人對某部分很熟悉，那就可以去看不清楚的地方即可，如果是完全沒有用過此類工具的人，建議邊操作邊參考流程以外，並多加閱讀其他參考資料。

1. 在 WordPress 上使用 Amplitude 追蹤行為事件
- Google Tag Manager for WordPress Plugin 安裝與基礎設定
- 建立 Amplitude Workspace 與設定 Data Source
- 使用 Google Tag Manager 埋設 Amplitude 事件
2. 使用 Google Data Studio 建立 Amplitude 數據 Dashboard
- 使用 Amplitude Syncs to Google Sheets Add-on 匯出數據
- 將 Google Sheets 資料匯入 Google Data Studio

簡單介紹一下 Amplitude，它是現在市面上最熱門的產品數據分析工具之一，可以在記錄使用者的行為之後產出各式各樣的報表，例如留存、轉換、同類群組分析等等。相較於以往的 GA，以行為而非頁面來分析更適合用在產品數據分析，近期 GA 4 推出後，也開始向此類工具看齊推出類似的分析功能，因此我也很期待 GA 4 之後的發展。

網路上 WordPress 跟 GA 的整合文章非常多，但會在 WordPress 上使用 Amplitude 的人超級少。除此之外，GA 跟 Data Studio 的整合當然沒問題，但網路上找到 Amplitude 要跟 Data Studio 整合的方法，不外乎自己要 Call Amplitude API 抓資料再匯入，不然就是要用付費的第三方工具，非常麻煩。因此我決定寫下這篇筆記，分享我們是怎麼一毛錢都不用花就做到的。

如果你喜歡我的文章，可以按下面的拍手！用推薦 ID【daniellee2309】免費註冊 LikeCoin 並在帳號設定中驗證手機號碼，我就能因為你的鼓勵獲得一些收入

行為事件（Event）：最常見的網站與 App 使用者行為追蹤方法

不知道大家有沒有想過自己的行為是怎麼被網站記錄下來的？以一個電商網站舉例，使用者在網站上通常會經過搜尋、查看商品頁、加入購物車、結帳等四個關鍵的步驟，而這個過程中每操作一個步驟都會觸發一個「行為事件」，把行為事件依序串在一起，就是一個「行為漏斗（Funnel）」。只要持續追蹤這個行為漏斗，電商網站就可以知道使用者在哪一步最容易離開購買流程。

本文就是講述怎麼讓 Amplitude 開始可以分析事件數據，並將這些數據導入到 Data Studio。

在 WordPress 上使用 Amplitude 追蹤行為事件

Google Tag Manager for WordPress Plugin 安裝與基礎設定

由於希望盡可能不動用工程人力，我們選擇使用 Google Tag Manager（GTM）作為我們「埋點」的核心工具。埋點／碼／標籤指的就是定義與設定事件的整個過程，而 GTM 是一個不用程式碼就能新增、編輯、管理代碼（標籤）的一個工具，因此受到許多行銷與網站分析人員的喜愛。一般而言 GTM 的前置設定還是需要前端工程師的幫忙，但是架設 WordPress 網站的使用者不一定都熟悉前端，因此有人開發了一個 WordPress 外掛，讓不會寫程式的人也能安裝 GTM 讓他們使用 GA 來監測網站數據。

這部分的設定簡單列一下，網路上有蠻多教學的可以再去參考看看：

1. 進入 GTM 頁面建立帳號
2. 進入 WordPress 控制台，搜尋外掛「Google Tag Manager for WordPress」第一個結果就是了，點擊立即安裝
3. 安裝完成後進入這個外掛的設定，輸入自己的 GTM 容器 ID
4. Container Code Part Placement 的地方選擇「頁面頁尾」（有可能會因此偶爾抓不到資料，但是比較方便）
5. 儲存設定

建立 Amplitude Workspace 與設定 Data Source

Amplitude 有基本的專案與權限管理設定，因此可以建立多個 Workspace。一個 Workspace 會使用一個 Data Source，因此官方建議大家除了正式專案用的 Workspace，也至少要多建立一個測試用的 Workspace，這樣在測試時所產生的事件資料才不會跟正式的資料混在一起。

1. 先到 Amplitude 頁面中點擊左下角的「Data Source」
2. 在 Data Source 頁面選擇「JavaScript SDK」
3. 記下並複製 Install SDK 中的 JavaScript code，這段程式碼會讓事件資料（還有其他類型資料也可以，但暫時不討論）根據 API_KEY 傳送到你指定的 Amplitude Workspace
4. 先在此頁暫停，開啟 GTM 繼續看下一階段的步驟

Step 1

Step 2

Step 3

使用 Google Tag Manager 埋設 Amplitude 事件

GTM 有跟非常多的數據工具整合，但不包含 Amplitude。所以必須在新增代碼時結合剛剛的 JacaScript SDK 進行一連串設定，以下簡單列出所需步驟：

1. 進入設定頁面後點擊左側欄位的「代碼」
2. 點擊「新增」
3. 在代碼設定中選擇「自訂 HTML」
4. 點選後在代碼設定的欄位中會有一個空白處，貼上剛剛在 Amplitude 複製的 JavaScript code
5. 回到 Amplitude 點擊 Next，然後複製 Sent First Event 區塊中的 JavaScript code，其中「EVENT_NAME_HERE」的地方就是你之後可以自由設定的事件名稱
6. 把剛剛這段 JavaScript code 貼到剛剛代碼設定中的程式碼的最下方
7. 在觸發條件中選擇 Page View 的 All Pages，這代表無論在網頁中的哪個頁面，你設定的事件就都會被觸發
8. 為你的代碼命名並按下儲存
9. 回到 GTM 首頁按下預覽，貼上你的 WordPress 網站網址，此時除了 GTM Tag Assistant 的頁面以外，會另外開啟進入偵錯模式的 WordPress 網站
10. 當 WordPress 網站載入後，理論上就會因為達成我們設定的觸發條件而觸發代碼，此時行為事件就會被記錄到 Amplitude 中
11. 回到 Amplitude，在 Log an Event 這一步的頁面下方，如果 Amplitude 收到的事件的資料，就會出現「We’ve received data from this source」的畫面，確認收得到資料後就按 Finish

Step 3

Step 4

Step 5 & 11

使用 Google Data Studio 建立 Amplitude 數據 Dashboard

前面都是在建立基本的資料採集流程，接下來才是正題。我查了很久 Amplitude 到底要怎麼簡單的串到 Google Data Studio，沒想到最終最簡單的方式是先串到 Google Sheets，再從 Google Sheets 串到 Google Data Studio。

為什麼選擇用 Google Data Studio

建立 Dashboard 與資料視覺化的工具非常多，最常見的就是 Power BI 與 Tableau，且也都有免費版（功能較少）。這次選擇 Data Studio 的原因主要還是協作方便，而且資源整合算是完善。

要實現多人共編一個 Dashboard，上述三者中免費的選項應該是只有 Data Studio，這成為我覺得 Data Studio 很有競爭力的主要原因。要分享 Dashboard 給需求方查看也跟其他 Google 產品一樣分享連結即可。

由於是 Google 系的產品，支援的資料輸入管道非常多，包含 GA、Google Ads、Google Sheets，也支援從 PostgreSQL 與 MySQL database 接資料，應該是已經把基礎的商業需求場景涵蓋了。

使用 Amplitude Syncs to Google Sheets Add-on 匯出數據

這是 Amplitude 官方提供的 Google Sheets 外掛，使用步驟如下：

1. 先在 Amplitude 建立 Dashboard
2. 在 Google Sheets 安裝這個外掛程式
3. 在外掛程式中，點擊 Amplitude Sync to Drive and Sheet，再點擊 Start Exporting Amplitude Data，接著 Amplitude — Export to Sheets 的 Panel 就會開啟
4. 在外掛中登入 Amplitude 帳號，就會出現 Dashboard 的名稱
5. 選擇想要串接的 Dashboard 點擊 Add，接著 Google Sheets 就會新增一個工作表並出現 Dashboard 的資料，要注意這個工作表不能編輯到，不然可能會影響資料的同步
6. 如果有需要更新資料，必需再次開啟外掛，然後在 Manage 的地方更新
7. 如果只要部分的數字，或是要進行格式調整、計算等等操作，可以另開試算表分頁，串接 Dashboard 的數字

Step 5 & 6

這邊讓我覺得不方便的地方有兩個：

1. 無法自動化同步，需要手動更新，這一點很傷的原因是我本來的目的是全自動化，但最後結果只能半自動化（需定期手動更新）
2. 在 Amplitude 裡要看漏斗過去 N 日的資料，他會把 N 天資料整合在一起，並不會有 N 天中每一天的資料，因此串接在 Google Sheets 裡的資料也是如此。要看到 by Day 的資料需要使用 Amplitude 提供的 API 自己串接，或是整合 Snowflake 用 SQL-like 的工具取數，或是在 Amplitude 中使用 Event Segment 導出每日資料，再自己做處理

將 Google Sheets 資料匯入 Google Data Studio

最後一階段就簡單多了，因為 Google Sheets 跟 Google Data Studio 有原生的整合，所以網路上也有很多資料可以參考，以下就簡單列一下步驟，說明如何匯入 Google Sheets 的資料：

1. 先建立一個空白報表
2. 建立資料來源並選擇 Google Sheets
3. 選擇自己有權限取得的試算表，如果沒有看到，先確認試算表有開啟權限
4. 選擇該試算表下所需的工作表。如上一階段所說，建議先在試算表裡清洗你的資料，把需要的欄位格式都決定好，再匯入至 Data Studio
5. 匯入之後可能欄位會長不一樣，那是因為 Google Data Studio 幫你選擇了資料呈現的維度，可以看看你所有的欄位是否出現在 Available Fields 的地方，有的話就是正確的匯入了
6. 如果要開始進行資料視覺化，建議點擊新增頁面（Add a page）把視覺化結果和原始資料分開放，分享出去時原始資料所在的頁面可以隱藏，這樣的閱讀體驗會比較好
7. 至於怎麼操作呈現出最後的視覺化結果不是本文重點，有興趣的就再去參考其他文章囉

Step 5 的 Data Source

Step 5 Imported Data

匯入資料之後，基本上就算完整從 Amplitude 到 Google Data Studio 的免費串接囉！之後只要到 Google Sheets 中按下 Dashboard 資料的更新，Data Studio 裡的數據也會在幾分鐘後一起更新。

以上就是本次的工具整合筆記，如果覺得喜歡記得幫我鼓掌，也不要忘記分享給你覺得有需要這個資訊的人！

如果你喜歡我的文章，可以按下面的拍手！用推薦 ID【daniellee2309】免費註冊 LikeCoin 並在帳號設定中驗證手機號碼，我就能因為你的鼓勵獲得一些收入