0
votes

I am using the gtag.js library in my website and view the result in google analytics. I have implemented the purchase event as follows:

trackPurchase({ checkoutResult, order, items }) {
  const gtagItems = items.map(item => orderItemToGAItem(item));
  this.gtag('event', 'purchase', {
    transaction_id: checkoutResult.transactionId,
    value: checkoutResult.amount,
    currency: checkoutResult.currency,
    shipping: order.shippingCost,
    itmes: gtagItems,
  });
}

And the GA debugger in chrome prints the following in console when the event is triggered:

Running command: ga("gtag_UA_********.send", "event", {currencyCode: "HKD", forceSSL: true, &gtm: "2oubc0", hitCallback: [function], eventCategory: "ecommerce", eventAction: "purchase", eventValue: 400})
analytics_debug.js:23 
Sent beacon:
[ ****** ]


analytics_debug.js:23 <unknown>        (&gtm)  2oubc0
analytics_debug.js:23 _j1              (&jid)  
analytics_debug.js:23 _j2              (&gjid) 
analytics_debug.js:23 adSenseId        (&a)    317378694
analytics_debug.js:23 apiVersion       (&v)    1
analytics_debug.js:23 clientId         (&cid)  [ ****** ]
analytics_debug.js:23 currencyCode     (&cu)   HKD
analytics_debug.js:23 ec:action        (&pa)   purchase
analytics_debug.js:23 ec:id            (&ti)   [ ****** ]
analytics_debug.js:23 ec:revenue       (&tr)   400
analytics_debug.js:23 ec:shipping      (&ts)   20
analytics_debug.js:23 encoding         (&de)   UTF-8
analytics_debug.js:23 eventAction      (&ea)   purchase
analytics_debug.js:23 eventCategory    (&ec)   ecommerce
analytics_debug.js:23 eventValue       (&ev)   400
analytics_debug.js:23 hitType          (&t)    event
analytics_debug.js:23 javaEnabled      (&je)   0
analytics_debug.js:23 language         (&ul)   en-us
analytics_debug.js:23 location         (&dl)   [ ****** ]
analytics_debug.js:23 screenColors     (&sd)   24-bit
analytics_debug.js:23 screenResolution (&sr)   2560x1440
analytics_debug.js:23 title            (&dt)   OrderInfo
analytics_debug.js:23 trackingId       (&tid)  [ ****** ]
analytics_debug.js:23 viewportSize     (&vp)   1643x928

I can see the event purchase in google analytics console, however, there is no label and I cannot find any of shipping, value, currency, transaction_id and item. How can I filter events by those value or view them?

Thanks in advance.

1

1 Answers

0
votes

Actually you cannot use any field names in the event params it you want them to integrate properly in Analytics. You should respect the names according to this section: https://developers.google.com/analytics/devguides/collection/gtagjs/migration#map_analyticsjs_fields_to_gtagjs_parameters

If you want to set the label, the field name to use is event_label, as follow :

this.gtag('event', 'purchase', {
  'event_label': checkoutResult.transactionId
});