GTM教學-Tiktok廣告電子商務埋設- 抓取多產品資料

Tiktok廣告追蹤參數，類似於臉書Facebook Pixel，其中Tiktok的參數使用Content為KEY值。因此如果你的網站是使用開店平台，且原本就有push指定DataLayer至你的GTM中，那麼你的重點就是查看，DataLayer有無與Tiktok所需要KEY值一樣，如果沒有，就需要跑JS的For迴圈，將資料的Key值進行更換。

本次系列TIKTOK抖音廣告電子商務埋設教學。一共會規劃3集，並且規劃成以下內容。

這一篇為GTM埋設TIKTOK廣告的最後一篇 – 抓取多產品資料，前一集我們透過GTM裡面的TT代碼埋設TT廣告事件的值，這一集我想要介紹，如果當你的產品有多個產品陣列，你要怎麼一口氣回傳這些資料，至GTM的資料層中，以供其他第三方平台的後續應用。

TT電子商務事件參照連結

本次系列使用平台為Shopline。你的網站DLV可能會與我示範的不同，因此還是要對應你的後台資料，做相對應的調整變動。

章節內容

1 修改舊有DLV資料格式
2 總結
3 更多文章

修改舊有DLV資料格式

GTM-Tiktok廣告電子商務埋設大全3 - 抓取多產品資料 | Tt廣告代碼埋設

本篇會透過原有的DLV資料，藉由更改陣列裡面的KEY值，對應到TIKTOK廣告所需要的格式，再回傳至TT的廣告後台。簡單講就是，更改原本這些資料，改成TT所能接受的格式，在丟給TT廣告系統後台。

新增變數1 – Dlv 資料

先至GTM的變數中，建立一個「資料層變數」，名稱打上你eventModel。但你的DLV一定會跟我不一樣，所以你要打上你對應的物件最外層的KEY值。如果有不懂的，直接看我YT的影片解說，會比較清楚哦! 版本記得選1，因為我們是要整串資料。

新增變數2 – cJS

function(){
  var ec = {{dlv - eventModel}}; 
  var ecItems = ec.items
  return ecItems.map(function(product){
    return {
      "content_id" : !!product.item_id ? product.item_id.toString() : undefined,
      "price" : !!product.price ? parseFloat(product.price) : undefined,
      "quantity" : !!product.quantity ? parseInt(product.quantity) : undefined,
      "content_name" : !!product.item_name ? product.item_name.toString() : undefined,
      "content_type" : "product"
    } 
  })
}

接著新增第二個變數 – 自訂JS，必且將「 {{dlv – eventModel}}」，改成你第一個新增的變數名稱。這裡的目的就是為了將新增變數1的資料，轉成TT所對應的資料，轉換完畢後，再將自訂JS的資料傳送給TIKTOK廣告後台。

DLV差異

這是透過步驟1所建立的DLV資料形式。

這是透過步驟 2，將步驟一的資料轉換後的資料形式。

你可以看到資料二已經有「content」開頭的KEY值，也符合TIKTOK的官方文件所需要的格式。

設定正確DLV

如果你有看前兩集的TIKTOK事件埋設，那你應該對這一個步驟不陌生。上面兩個變數都新增完後，你可以回到你原本設定TT代碼中，選擇其中一個事件 (通常是購買、結帳)，並且選擇「Multiple Contents」，最後在下方「Content」中，輸入你剛剛新增好的變數 (自訂JS那個)即可。

回到TIKTOK廣告後台查看

回到TIKTOK的廣告後台，你可以看到事件接收正確，且沒有任何驚嘆號出現。另外是他的資料參數，有多個產品資料、產品價格等，看到這樣的畫面代表即完成。

總結

當你完成這三篇Tiktok廣告追蹤埋設，相信你的Tiktok廣告追蹤也順利正常啟動了，有問題歡迎聯繫我們。

GTM教學｜Tiktok廣告電子商務埋設大全3｜廣告代碼埋設

修改舊有DLV資料格式

新增變數1 – Dlv 資料

新增變數2 – cJS

DLV差異

設定正確DLV

回到TIKTOK廣告後台查看

總結

更多文章

Looker Studio

GA4

GTM

BigQuery

其他

相關