埋追蹤碼 - HackMD

###### tags: `埋追蹤碼`、`GTM` # 埋追蹤碼 ## 索引 - 建立GTM容器code(目前為優化師負責) - [埋容器code](#埋容器code) - [透過GTM埋設追蹤碼](#透過GTM埋設追蹤碼) - [注意事項](#注意事項) - [追蹤碼類型](#追蹤碼類型) - [感謝頁](#感謝頁) - [追蹤碼範例檔案](#追蹤碼範例檔案) ## 埋容器code 從GTM取得容器2段code，將code放在html檔指定位置(1段置於<head>中，另1段置於<body> 開頭代碼正後方。) 1. 給客戶容器code檔案，請客戶自行埋設 2. 幫客戶埋容器code: 1.請客戶開啟後台(如wordpress) 2.請客戶給html檔 3.con-call --- ## 透過GTM埋設追蹤碼 1. 從Monday，或信件獲得需埋設的code、GTM帳號、客戶網址 2. 整理code，將PV、同事件不同平台的code整理好分檔案 3. 整理同時可以檢查code有沒有問題(如yahoo 的pixelid 應該要一樣，不同的是'ea'的事件名稱) 4. 如果有監測表單傳送，要另外加上檢查表單有無填寫(視情況) 5. 進GTM工作區→代碼→新增→命名代碼、代碼設定(自訂HTML→將pv或追蹤碼貼上→選擇觸發條件)→儲存 6. 觸發條件選擇類型(如點擊)、變數、條件(可用css選擇器，到網頁開開發者模式點copy selector，再把路徑貼到GTM) 7. 儲存後用預覽檢查電腦版與手機板是否都有觸發 8. 確認後按提交發布，命名Click Force_V幾 9. 去原網址做最後檢查 10. 確認內容無誤後，截圖上傳到Monday，並寫上測試結果(依以下格式) > 格式範例: 需求：客戶需要請我們埋設追蹤碼+檢查客戶名稱：網站：埋設平台：埋設方式：客戶開放GTM權限讓我方埋設＋檢查是否成功觸發埋設code： PV、事件*6（ 1. 送出表單-CFsubmit 2. 撥打電話-CFtel 3. 線上諮詢-CFmessanger 4. 前往粉專-CFfb 5. 了解更多-CFinfo 6. google地圖-CFmap） GTM: clickforce04@gmail.com GTM-5H85KFS Code檔案： 2022/09/28 吉美富徠完成埋設且已發布檢查結果： PV DSP、DMP、GA、FB、Google ads成功觸發電腦版 DSP DMP GA Google Ads FB 手機版 DSP DMP GA Google Ads FB ---------------------------------------------- 事件：1. 送出表單-CFsubmit MF、GA、Google Ads、FB成功觸發電腦版 DSP DMP GA Google Ads FB 手機版 DSP DMP GA Google Ads FB ---------------------------------------------- 詳細補充 --- ## 注意事項 1.追蹤碼類型: * MF(Click Force, DSP): 查碼rtid('id')，沒有事件名稱，要看id辨別 * MF(Click Force, DMP): 查碼analytic;cft("setSiteId", "CF-220500115299");，有事件名稱，有viewPercentage * GA(Google Analytics): 查碼UA-9碼-1碼，有事件名稱 * GA4(Google Analytics4): 查碼G-HN26ESRV15，有事件名稱(但會帶在pv一連串網址中)，重要: script 和 code要放在GA後面，以免GA pv觸發兩次，或GA4 感謝頁無法觸發，如有任何問題可以試著移動一下順序 * Google Ads: 查碼AW-11碼+一串事件碼，沒有事件名稱，除pv外，事件在Network會出現4項搜尋結果 * FB: fbq('事件名稱', '查碼15碼') * Line: 查碼_lt('send', 'cv'/'pv', {type: '事件名稱'},['追蹤碼-不同事件也是一樣的']); * Yahoo: { 'projectId': '查碼:所有事件都一樣', 'properties': { 'pixelId': '查碼:所有事件都一樣-不一樣要反映', 'qstrings': { 'et': 'custom', 'ea':'事件名稱-應該每個都不一樣' } * DV360: 查碼DC-8碼，PV沒有名稱 2.感謝頁(兩種出現方式) 1. 出現新的div: 有些閱覽條件(如填完表單後出現的div)，不能使用GTM提供的瀏覽和DOM事件(因為一網頁載入完就監測了，此時可以手動用function將監測code寫在上一個動作裡 2. 跳轉新頁面: 1. 使用閱覽網頁，選擇部分閱覽包含或等於特定網址 2. 追蹤碼要再附上pv code裡的連結(因為如果感謝頁code先執行，會找不到連結script而無法執行) #### 以MF為例，需要再放置以下連結 ```html= <script src="https://cdn.holmesmind.com/js/rtid.js"></script> <script src="https://cdn.holmesmind.com/dmp/cft/triggerTracker.js"></script> <script async src="https://cdn.holmesmind.com/dmp/cft/tracker.js"></script> ``` 3.追蹤碼範例檔案: https://drive.google.com/file/d/1MMb7h_MfzsbOsg7PLAJ9RieMiTK_dDcE/view?usp=sharing

Syntax	Example	Reference
# Header	Header	基本排版
- Unordered List	Unordered List
1. Ordered List	Ordered List
- [ ] Todo List	Todo List
> Blockquote	Blockquote
Bold font	Bold font
Italics font	Italics font
~~Strikethrough~~	~~Strikethrough~~
19^th^	19^th
H~2~O	H₂O
++Inserted text++	Inserted text
==Marked text==	Marked text
[link text](https:// "title")	Link
![image alt](https:// "title")	Image
`Code`	`Code`	在筆記中貼入程式碼
```javascript var i = 0; ```	`var i = 0;`
:smile:		Emoji list
{%youtube youtube_id %}	Externals
$L^aT_eX$	L^aT_eX
:::info This is a alert area. :::	This is a alert area.