ย้ายข้อมูลจาก analytics.js ไปยัง gtag.js (Universal Analytics)

คู่มือนี้จะอธิบายขั้นตอนการย้ายข้อมูล analytics.js การติดตั้งใช้งาน Universal Analytics ที่มีอยู่เพื่อใช้ gtag.js

ภาพรวม

analytics.js มีกลไกหลัก 2 อย่างในการส่งข้อมูลไปยัง Google Analytics ได้แก่

  1. เครื่องมือติดตาม

    เครื่องมือติดตามจะระบุพร็อพเพอร์ตี้ที่คุณกําลังวัด

  2. ประเภท Hit

    ประเภท Hit จะระบุประเภทการโต้ตอบที่คุณกําลังวัด

ในพร็อพเพอร์ตี้ gtag.js ระบุผ่านคําสั่ง config หรือระบุเป็นพารามิเตอร์ของคําสั่ง

gtag.js ต่างจาก analytics.js ตรงที่จะไม่ใช้เครื่องมือติดตามเพื่อส่งข้อมูลไปยัง Google Analytics โดยส่งข้อมูลไปยังพร็อพเพอร์ตี้ Google Analytics ที่ระบุโดยรหัสซึ่งกําหนดโดยคําสั่ง config ชื่อเหตุการณ์ที่ส่งไปยัง gtag.js จะระบุประเภทของข้อมูลที่กําลังส่งไปยัง Google Analytics

หากต้องการย้ายข้อมูลจาก analytics.js ไปยัง gtag.js ให้ทําดังนี้สําหรับหน้าเว็บทุกหน้าของเว็บไซต์

แทนที่ข้อมูลโค้ด analytics.js ด้วยข้อมูลโค้ด gtag.js

แทนที่ข้อมูลโค้ด analytics.js ในหน้าเว็บ

<!-- Google Analytics -->
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

  ga('create', 'TAG_ID', 'auto');
  ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

ด้วยข้อมูลโค้ด gtag.js ต่อไปนี้

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'TAG_ID');
</script>

วัดการดูหน้าเว็บ

analytics.js ใช้เครื่องมือติดตามเพื่อส่งการดูหน้าเว็บไปยัง Google Analytics เครื่องมือติดตามมีรหัสการวัดของพร็อพเพอร์ตี้ Google Analytics โดย gtag.js จะส่งการดูหน้าเว็บไปยังพร็อพเพอร์ตี้ Google Analytics ที่ระบุโดย TAG_ID ซึ่งระบุในคําสั่ง config

วัดการดูหน้าเว็บด้วยเครื่องมือติดตามเริ่มต้น

นําโค้ด analytics.js ต่อไปนี้ซึ่งใช้เครื่องมือติดตามเริ่มต้นไปยังการดูหน้าเว็บของ send ไปยัง Google Analytics

// Creates the default tracker.
ga('create', 'TAG_ID', 'auto');

// Uses the default tracker to send a pageview to the
// Google Analytics property with tag ID of 'TAG_ID'.
ga('send', 'pageview');

โค้ดต่อไปนี้ในข้อมูลโค้ด gtag.js จะส่งการดูหน้าเว็บไปยังพร็อพเพอร์ตี้ Google Analytics ที่มีรหัสแท็ก TAG_ID โดยอัตโนมัติ

gtag('config', 'TAG_ID');

วัดการดูหน้าเว็บด้วยเครื่องมือติดตามที่ระบุ

แทนที่โค้ด analytics.js ต่อไปนี้ซึ่งใช้เครื่องมือติดตามที่ระบุเพื่อส่งการดูหน้าเว็บไปยัง Google Analytics

ga('create', 'TAG_ID', 'auto', 'trackerName');
ga('trackerName.send', 'pageview');

ด้วยคําสั่ง gtag.js event ต่อไปนี้

gtag('event', 'page_view', { 'send_to': 'TAG_ID' });

วัดเหตุการณ์

ตามที่ได้กล่าวไว้ก่อนหน้านี้ analytics.js ใช้เครื่องมือติดตามเพื่อส่งเหตุการณ์ไปยัง Google Analytics เครื่องมือติดตามมีรหัสติดตามของพร็อพเพอร์ตี้ Google Analytics ในทางตรงกันข้าม gtag.js จะส่งเหตุการณ์ไปยังพร็อพเพอร์ตี้ Google Analytics ที่ระบุโดย TAG_ID ที่ระบุในคําสั่ง config

วัดเหตุการณ์ด้วยเครื่องมือติดตามเริ่มต้น

แทนที่โค้ด analytics.js ต่อไปนี้ที่ใช้เครื่องมือติดตามเริ่มต้นไปยังเหตุการณ์ send ไปยัง Google Analytics

ga('create', 'TAG_ID', 'auto');
ga('send', 'event', [eventCategory], [eventAction], [eventLabel], [eventValue], [fieldsObject]);

ด้วยคําสั่ง gtag.js event ต่อไปนี้

gtag('event', eventName, eventParameters);

โดยที่ eventName คือชื่อเหตุการณ์ที่คุณต้องการบันทึก

ตัวอย่าง

analytics.js

// Creates the default tracker.
ga('create', 'TAG_ID', 'auto');

// Uses the default tracker to send the event to the
// Google Analytics property with a tag ID of `TAG_ID`.
ga('send', 'event', 'Videos', 'play', 'Fall Campaign');

gtag.js

// Sends the event to the Google Analytics property with a
// tag ID of `TAG_ID` set by the config command in
// the gtag.js snippet.
gtag('event', 'play', {
  'event_category': 'Videos',
  'event_label': 'Fall Campaign'
});

วัดเหตุการณ์ด้วยเครื่องมือติดตามที่ระบุ

แทนที่โค้ด analytics.js ต่อไปนี้ซึ่งใช้เครื่องมือติดตามที่ระบุเพื่อส่งเหตุการณ์ไปยัง Google Analytics

ga('create', 'TAG_ID', 'auto', 'trackerName');
ga('trackerName.send', 'event', [eventCategory], [eventAction], [eventLabel], [eventValue], [fieldsObject]);

ด้วยคําสั่ง gtag.js event ต่อไปนี้

gtag('event', eventName, {
  'send_to': 'TAG_ID',
  'parameter1': 'value1',
  'parameter2': 'value2',
  // ...
});

ตัวอย่าง

analytics.js

// Creates a tracker named <b>clientTracker</b>.
ga('create', 'TAG_ID', 'auto', 'clientTracker');

// Uses tracker clientTracker to send the event to the
// Google Analytics property with a tag ID of TAG_ID.
ga('clientTracker.send', 'event', 'Videos', 'play', 'Fall Campaign');

gtag.js

// Send the event to the Google Analytics property
// with a tag ID of 'TAG_ID'.
gtag('event', 'play', {
  'send_to': 'TAG_ID',
  'event_category': 'Videos',
  'event_label': 'Fall Campaign'
});

ส่งมิติข้อมูลและเมตริกที่กําหนดเอง

แทนที่คําสั่ง analytics.js send ในหน้าเว็บที่ส่งมิติข้อมูลที่กําหนดเอง ไปยัง Google Analytics ดังนี้

ga('send', 'hitType', { 'dimension&lt;Index&gt;':  'dimension_value'});

พร้อมด้วยโค้ด gtag.js ต่อไปนี้

gtag('config', 'TAG_ID', {
  'custom_map': {'dimension<Index>': 'dimension_name'}
});
gtag('event', 'any_event_name', {'dimension_name': 'dimension_value'});

แทนที่ TAG_ID ด้วยรหัส Analytics ของคุณเอง

แทนที่คําสั่ง analytics.js send ในหน้าเว็บที่ส่งเมตริกที่กําหนดเอง ไปยัง Google Analytics ดังนี้

ga('send', 'hitType', { 'metric<Index>':  'metric_value'});

พร้อมด้วยโค้ด gtag.js ต่อไปนี้

gtag('config', 'TAG_ID', {
  'custom_map': {'metric<Index>': 'metric_name'}
});
gtag('event', 'any_event_name', {'metric_name': 'metric_value'});

แทนที่ TAG_ID ด้วยรหัสแท็ก

วัดระยะเวลาของผู้ใช้

แทนที่คําสั่ง analytics.js send ในหน้าเว็บที่ติดตามระยะเวลาของผู้ใช้ ดังนี้

ga('send', 'timing', 'timingCategory', 'timingVar', timingValue, 'timingLabel');

ด้วยคําสั่ง gtag.js event ต่อไปนี้

gtag('event', 'timing_complete', {
  'name': 'timingVar',
  'value': timingValue,
  'event_category': 'timingCategory',
  'event_label': 'timingLabel'
});

วัดข้อยกเว้น

แทนที่คําสั่ง analytics.js send ในหน้าเว็บของคุณซึ่ง ติดตามข้อยกเว้น:

ga('send', 'exception', {
  'exDescription': 'error_message',
  'exFatal': false  // set to true if the exception is fatal
});

ด้วยคําสั่ง gtag.js event ต่อไปนี้

gtag('event', 'exception', {
  'description': 'error_message',
  'fatal': false  // set to true if the exception is fatal
});

แมปช่อง analytics.js กับพารามิเตอร์ gtag.js

ตารางต่อไปนี้แมปช่อง analytics.js กับพารามิเตอร์ gtag.js ที่เกี่ยวข้อง

กิจกรรม

ช่อง analytics.js พารามิเตอร์ gtag.js
eventAction event_action
eventCategory event_category
eventLabel event_label
eventValue value

มิติข้อมูลและเมตริกที่กำหนดเอง

ช่อง analytics.js พารามิเตอร์ gtag.js
dimension<Index> dimension<Index>
metric<Index> metric<Index>

โดยที่ <Index> เป็นจํานวนเต็มที่ไม่ใช่ค่าลบซึ่งแสดงถึงดัชนีของมิติข้อมูลหรือเมตริกที่กําหนดเอง

ระยะเวลาของผู้ใช้

ช่อง analytics.js พารามิเตอร์ gtag.js
timingCategory event_category
timingLabel event_label
timingValue value
timingVar name

การวัดข้อยกเว้น

ช่อง analytics.js พารามิเตอร์ gtag.js
exDescription description
exFatal fatal

ข้อมูลการกระทําของอีคอมเมิร์ซที่เพิ่มประสิทธิภาพ

ช่อง analytics.js พารามิเตอร์ gtag.js
id transaction_id
affiliation affiliation
revenue value
tax tax
shipping shipping
coupon coupon
list list_name
step checkout_step
option checkout_option

ข้อมูลโปรโมชัน

ช่อง analytics.js พารามิเตอร์ gtag.js
creative creative_name
position (การแสดงผล ผลิตภัณฑ์) list_position
position (โปรโมชัน) creative_slot

การดําเนินการกับผลิตภัณฑ์และโปรโมชัน

ช่อง analytics.js เหตุการณ์ gtag.js
add add_to_cart
checkout (ขั้นตอนแรก) begin_checkout
checkout (ขั้นตอนใดก็ได้หลังจากนั้น) checkout_progress
checkout_option set_checkout_option
click select_content (ไม่มีโปรโมชัน)
detail view_item
promo_click select_content (มีโปรโมชัน)
purchase purchase
refund refund
remove remove_from_cart

รหัสไคลเอ็นต์และรหัสผู้ใช้

ช่อง analytics.js พารามิเตอร์ gtag.js
clientId client_id
userId user_id