Hi,
I believe the current template does not support GA's enhanced Commerce tracking properly.
When using Enhanced Commerce Tracking, the order confirmation page will no longer send a separate purchase
tracking call on top of the standard page_view
tracking call. Instead, everything is part of a single page_view
call, just with extra params (see the official doc for reference). I have pasted below an example of a GA tracking call for such an order confirmation page.
I know that this enhanced commerce and tracking call is correct because we've been using this standard setup for a couple of years and our e-commerce data in GA is 100% accurate when compared to our store's data.
The problem I see is that the template operates a simple conversion for finding the FB event name:
const GTM_EVENT_MAPPINGS = {
"add_payment_info": "AddPaymentInfo",
"add_to_cart": "AddToCart",
"add_to_wishlist": "AddToWishlist",
"page_view": "PageView",
"purchase": "Purchase",
"search": "Search",
"begin_checkout": "InitiateCheckout",
"generate_lead": "Lead",
"view_item": "ViewContent",
"signup": "CompleteRegistration"
};
...
function getFacebookEventName(gtmEventName) {
return GTM_EVENT_MAPPINGS[gtmEventName] || gtmEventName;
}
...
event.event_name = getFacebookEventName(eventModel.event_name);
so on the order confirmation page, the event name is in fact page_view
and so FB misses the purchase.
It sounds like we would need to do something like this instead:
if(eventModel['x-ga-mp1-pa'] && eventModel['x-ga-mp1-pa'] === "purchase") {
// we're on the order confirmation page
event.event_name = GTM_EVENT_MAPPINGS.purchase;
} else {
event.event_name = getFacebookEventName(eventModel.event_name);
}
It seems like eventModel['x-ga-mp1-pa']
is what is detecting the custom enhanced e-commerce purchase event, but this may need to be confirmed by Google.
Also, worth noting that for Enhanced Commerce, eventModel.value
is ont defined, but instead seems to live under eventModel['x-ga-mp1-tr']
so perhaps we could update the line picking up the order value as shown below:
event.custom_data.value = eventModel.value || eventModel['x-ga-mp1-tr'];
Please let me know your thoughts.
Thank you.
Here is a full request with a few sensitive key redacted:
Key data is that transaction id is 8823 and order value is £390
https://<our-domain>/collect?v=1&_v=j88&a=1983809381&t=pageview&cu=GBP&_s=1&dl=https%3A%2F%<our-domain>%2Fcheckout%2Forder-received%2F8823%2F%3Fkey%3Dwc_order_AAAAHtvmljJ4&ul=en&de=UTF-8&dt=Checkout%20-%20SleepyHead%20Program&sd=24-bit&sr=1440x900&vp=1282x343&je=0&_u=SCCAAEAL~&jid=&gjid=&cid=552132149360.1606993001&tid=<our-ua-id>&_gid=502349238492836695>m=2wg3h05RFR7QC&ti=8823&ta=&tr=390&tt=0&ts=0&tcc=&pa=purchase&pr1id=6589&pr1nm=<product-name>&pr1ca=<product-category>&pr1pr=390&pr1qt=1&z=2005821312