結帳行為分析 – 電子商務界的目標程序設定、漏斗分析



本篇文章重點關鍵字/標籤:

說到增強型電子商務 Enhanced Ecommerce 的結帳行為分析..

這幾個禮拜都有提到,這所謂的 “增強型電子商務 Enhanced Ecommerce” 還真的不是微微地增強而已,除了有更多電子商務網站交易、轉換過程數據可以分析外,連商品是否被瀏覽、又是否被放入購物車到前幾個禮拜也有提過的 “退款資料匯入” 等訪客瀏覽等動作行為都可以盡可能忠實記錄。

而今天要介紹的是另一個增強型電子商務中相當實用的數據分析報表 – “結帳行為分析” 能夠讓我們為結帳頁面就像是在為某個重要網頁設定目標時,同時設定抵達該目標網頁所會經過的程序流程(途徑)後,在 轉換 > 目標 > 程序視覺呈現 報表上看到的漏斗分析(如下圖)是一樣效果。

只不過這漏斗分析從由上至下改為由左到右如這篇文章的封面圖,然後一樣可以深入研究每一個環節的流失(放棄)率或說數量是多少,如此就可以試著分析、監控每個結帳流程轉換率並盡力改善以提升網站獲利惹。

題外話:
既然都提到這是電子商務界的目標程序設定了,那想要先溫習一下的朋友也可以到我們好久好久好久好久好久以前提到的 “目標設定 – 實際連結目標網址達成確認” 走走。

至於上面也有稍微提到的退款資料匯入,就可以參考我們在 “退款資料匯入,決定增強型電子商務追蹤數據分析準確度” 這篇文章提到的介紹。

(為了避免瀏覽文章的心情與思緒被打斷,這篇文章中若如上方有出現超連結,建議是可以按著 Ctrl(或 ⌘ Command) 鍵再點選該連結。如此就可以先默默另開視窗,等待會有空或真的有需要時再到另一個頁籤查看喔!!)

目標程序視覺呈現示意圖

先從管理員介面設定電子商務結帳標籤

在置入真的很麻煩的 Javascript 碼之前,有一個在這篇文章中唯一比較適合闔家觀賞與操作的步驟,就是還請各位移駕到 管理員介面 > (資料檢視下方的)電子商務設定頁面,接著 “啟用電子商務” 與下一步後再 “啟用電子商務設定” ,就可以在下方的 “程序步驟” 編號右側輸入從放入購物車到真正結帳的每一個頁面名稱了如下圖。

下圖範例程序步驟設定為:
1:進入購物車首頁
2:進入結帳區
3:確認商品、收貨相關資訊後送出訂單

題外話:
有關這管理員介面,我們之前在 “網站分析管理員介面 – 同一個帳戶的多網站資源管理” 也有進行過相對全面的介紹,對於想要好好讓 Google Analytics 分析功能最大化的朋友絕對走過路過不要錯過喔。

電子商務設定之設定結帳標籤

然後請在不同流程結帳頁面置入結帳流程編號追蹤碼

在上一段落的介紹中,每一個頁面就是對應一個程序步驟編號。接著,這時一樣就可以參考 Google 大大 Developer 的文件指南說明與範例,將結帳程序流程編號1追蹤碼,置入於採購流程第一步對應的頁面原始碼中,增強型電子商務追蹤碼的 ec:addProduct 下方,就會像是以下這個範例。

ga('create', 'UA-XXXXX-Y');
ga('require', 'ec');

/**
 * Called when the user begins the checkout process.
 * @param {Array} cart An array representing the user's shopping cart.
 */
function checkout(cart) {
for(var i = 0; i < cart.length; i++) {
var product = cart[i];
ga('ec:addProduct', {
'id': product.id,
'name': product.name,
'category': product.category,
'brand': product.brand,
'variant': product.variant,
'price': product.price,
'quantity': product.qty
});
}
}

// In the case of checkout actions, an additional actionFieldObject can
// specify a checkout step and option.
ga('ec:setAction','checkout', {
'step': 1, // A value of 1 indicates this action is first checkout step.
});
ga('send', 'pageview'); // Pageview for payment.html

而在程序流程編號2的頁面,也一樣請參考 Google Developer 說明文件,就再請更改 step 對應的值為2如 ‘ec:setAction’,’checkout’, {‘step’: 2}); 即可。
而加入該頁面後就會是以下這個範例。

Measure checkout step 2:
ga('create', 'UA-XXXXX-Y');
ga('require', 'ec');

/**
 * Called when the user begins the checkout process.
 * @param {Array} cart An array representing the user's shopping cart.
 */
function checkout(cart) {
for(var i = 0; i < cart.length; i++) {
var product = cart[i];
ga('ec:addProduct', {
'id': product.id,
'name': product.name,
'category': product.category,
'brand': product.brand,
'variant': product.variant,
'price': product.price,
'quantity': product.qty
});
}
}

ga('ec:setAction','checkout', {'step': 2});
ga('send', 'pageview'); // Pageview for shipping.html

當然第三步或有第四步就以此類推,如此一來,今後就可以在 Google Analytics > 轉換 > 電子商務 > 購物分析 > 結帳行為 報表看到訪客的結帳流程漏斗分析了。

題外話:
如了在此也再次協助放上 “Enhanced Ecommerce – Web Tracking (analytics.js)” 說明文件連結外,其實在 Google Developer 說明文件中還有提到另一個可以自訂追蹤的欄位名稱為 option 如下圖,可以幫助我們追蹤到更多的結帳流程相關數據如使用信用卡 MasterCard 或 VISA 等.. 只是其詳細操作與置入辦法,我們會再陸續進行研究與介紹的,敬請期待.. ^^”

增強型電子商務追蹤碼欄位名稱:option

在今天增強型電子商務的結帳行為分析介紹之後…

其實若大家真的開始分析這電子商務結帳行為後應該也會發現,通常流失率最高的地方都會在採購流程中突然跳出要訪客加入會員,又或者是加入會員需要填入超多個人資料(如身分證字號就真的不知道是為了什麼 ^^”)。

在此真的會建議所謂電子商務網站的經營,就或許真的是讓訪客可以在網站上快速完成電子商務等流程。要求一定要加入會員,或非得要輸入生辰八字、血型或對藥物有沒有過敏等或許都不是一個很理想的做法(訪客若真的覺得自己會常來這網站,或是真的想享用加入會員的優惠等就自己會想辦法加入..)。

但若是問到最少需要輸入哪些訊息,或許就是收件者姓名、電話與地址等這些可以完成交易的就好。像是 “美而浦淨水器” 、台灣天然安全清潔用品 “木酢達人” 又或者是我們可讓關島旅遊行程更好玩一萬倍的 “關島之家” 等,都不用加入會員就可以瘋狂採購了喔..

不過,若真的遇到了一位硬弄了個收件地址出來,收了件後就隱姓埋名,最後線上刷卡後到下個月扣款時戶頭又僅存零元的買家..
那也只能說這位買家真的很用心嘍 ^^”

採購過程完全不用加入會員



有關這位努力看見數據的人

蔡先生

共同創辦人/專案總監 業務接洽/聯絡方式..
Email Address: ada@awoo.ai / Line ID: 539406

目前主職 awoo MarTech 技術 nununi 推廣暨服務顧問,且深耕 SEO & Google Analytics 技術多年,曾有幸擔任國內各大知名企業、品牌與協會技術交流講師,且除了盡力看見數據外更盡可能抽空看見臺北各大特色咖啡館/優質廠商於 www.triplew.tw。

努力看見數據的人

蔡先生

共同創辦人/專案總監 業務接洽/聯絡方式.. Email Address: ada@awoo.ai / Line ID: 539406 目前主職 awoo MarTech 技術 nununi...

技術交流邀約(全國可談)

ada@awoo.com.tw
02-87121128#23

回頁面頂端