GTM教學｜DOM抓取電商中的轉換價值
DOM變數的功能滿適合用在許多類型的網站，像是電商資料的數值、表單內的個人資料抓取。
DOM變數的功能滿適合用在許多類型的網站，像是電商資料的數值、表單內的個人資料抓取。如果網站開發人員設計有到位，基本上抓取這些很容易。今天這篇算是比較進階的教學， 你得先了解一些CSS Selector的使用方式 ，以及懂查看網頁的Html。學會抓取dom的元素後，基本上你已經可以抓取大約快全部的GTM內容，可以說是接近無敵了!
如果你是想要學習完整的CSS-Selector抓取方法，那你可以參閱這篇「 基礎CSS-SELECTOR選擇器使用，選取器抓取表格的值 」
進入變數
進入GTM左側選單的變數中，並點選新增，於選單中新增「DOM元素變數」。
DOM元素的詳細介紹
編號=網站元素中的ID屬性 Css選取器(CSS Seletor)可找尋網站html當中的ID、CLASS或其他屬性，是一個很常用的技巧。
EX: 測試按鈕 abc為這一個Button的ID，因此如果你選擇選取方式為ID，下面填寫"abc"即可。
如果想要學完整CSS-SELECTOR，可以查看這一篇文章。
如果是要CSS選擇器設定電商事件的參數，可以參考「 GTM電子商務埋設大全1 - CSS Selector抓取Value，GA4電子商務完整代碼埋設 」
對應網站元素填入空格中
藉由第4張範例圖，我們可以得知8358元的標籤，裡面的ID為total_amont，因此在GTM的DOM元素變數中，按照以下步驟。
如果想查看完整電商事件金額，你可以查看「 CSS Selector抓取Value，GA4電子商務完整代碼埋設 」。
1.選擇「編號(ID)」，作為選取條件 2.輸入選取條件為「total_amount」 3.在屬性名稱中填入「value」 **可以看範例圖說明
預覽模式檢查
進入剛剛要抓取的頁面，點選DOM READY，即可看到變數8358的金額，已經成功被GTM抓取。這一招也可以應用在電子商務的Value抓取，或名單類型網站都適用。
DOM資料的抓取，可以幫助我們抓取，並返回網站的動態內容資料，例如每一單的購物金金額，隨著DOM內容不同，也可以返回不同的Value給GTM做讀取。是一招電子商務埋設技巧必備之一！
需要任何協助嗎？
最快一個工作天將與您聯繫。
其他文章推薦
查看更多 →
【成功案例】修復GA4 網店總收益落差
台灣開店平台常有數據與GA4 數據大幅落差問題。導致數據人員無法判讀數據的困擾。
【成功案例】修復GA4 網店工作階段判讀落差
本次黑客修復網店utm 臉書廣告歸因判讀，以及direct / none 歸因判讀錯誤問題。成功將網店的臉書廣告歸因提升141% 正確修復，而direct / none 也有明顯下降！
Looker Studio ｜國外串接工具 Supermetrics, Adveronix 價格比較整理
目前台灣要將臉書廣告數據、Google Ads、META 社群數據，或是GA4 數據彙整至Google Sheet, Looker Studio 都需要依賴以下這幾項工具 快客 、 Porter Metrics、Supermetrics、Reporting Ninja、Adveronix 與 Dataslayer.ai 。 如果你是正在尋找這種第三方串接工具的，這篇文章會很適合你，同時也可以考慮，由黑客數位所開發的串接工具 快客，價格合理、不限查詢次數、整合台灣常用資料源、全中文介面、中文客服支援 。本篇將深入比較五款熱門行銷報告與資料自動化工具 —— 快客 、Porter Metrics、S
Looker Studio 教學｜Super Metrics 串接教學
讓looker studio 串接臉書廣告數據。本篇文章使用supermetrics 帶你從0串接你的facebook ads 廣告數據。supermetrics 提供一個月999的台幣為授權使用費，也有提供免費使用的14天版本。
【成功案例】GTM 伺服器, Meta CAPI - GA4 完整導入
本次黑客與台灣知名充電站品牌 EVOASIS 合作。提供部署GTM 伺服器追蹤、META CAPI設定、GA4 完整電商事件導入。黑客提供前後端完整技術支援，協助客戶蒐集到更準確的事件追蹤數據。
【成功案例】修正GA4 總收益數據落差
本次黑客與勵馨基金會合作，GA4 修正顧問指導。從原本大幅捐款金額落差，網站只有蒐集到網站10%的金額數據。至透過黑客提供正確修正流程，網站收益金額提高到7-8成的數據正確。
【成功案例】內容型漏斗規劃
本次黑客與 UDRIVE City 合作，規劃 GA4 內容型網站漏斗事件。從原本完全沒有任何GA4 數據，完整揭露每一個網站用戶的行為節點。提高後續數據分析的完整性，加入購物車事件↑∞、購買事件↑∞。
【成功案例】多管道數據報表建置
本次黑客與 古北町 合作，規劃 Looker Studio 多管道數據報表。結合 META廣告數據 x GOOGLE Ads 數據。整理、重新規劃原本凌亂難讀的數據報表，提供人員無需再手動整理數據、匯出Excel 數據等。提高後續數據分析的效率。
【成功案例】數據分析轉換率優化
本次黑客與 DEPIC 合作。Looker Studio, Clarity, AB TEST, GA4 工具。替客戶找出網站熱門動線、專注區域，以及透過數據判斷冗贅流程、商品頁過長、修正用戶購物流程等。打造多管道報表，有助於企業未來在數據分析時更加有效率。