อีคอมเมิร์ซของ GA4 (gtag.js): ส่งเหตุการณ์ Universal Analytics และ GA4

คู่มือนี้อธิบายวิธีรักษาการติดตั้งใช้งานอีคอมเมิร์ซของ gtag.js Universal Analytics และ Google Analytics 4 แยกกัน

ไปที่ศูนย์การย้ายข้อมูลสําหรับนักพัฒนาซอฟต์แวร์เพื่อดูคู่มือและแหล่งข้อมูลการอัปเกรดเพิ่มเติม

ผลลัพธ์

ผลลัพธ์ที่ตามมาของคู่มือนี้คือคุณจะใช้เหตุการณ์อีคอมเมิร์ซ ของ Google Analytics 4 สําหรับพร็อพเพอร์ตี้ GA4 ใหม่ และทําให้การใช้งานอีคอมเมิร์ซ Universal Analytics ที่มีอยู่ไม่เปลี่ยนแปลง คุณจะส่งเหตุการณ์อีคอมเมิร์ซ แยกต่างหากไปยังทั้งพร็อพเพอร์ตี้ Universal Analytics และ Google Analytics 4

โปรดทราบว่าเมื่อคุณใช้อีคอมเมิร์ซสําหรับทั้ง UA และ GA4 พร็อพเพอร์ตี้ Google Analytics 4 จะใช้การติดตั้งใช้งานอีคอมเมิร์ซของ GA4

ก่อนเริ่มต้น

  1. ใช้เครื่องมือผู้ช่วยการย้ายข้อมูลอีคอมเมิร์ซเพื่อยืนยันว่าสิ่งต่อไปนี้อธิบายการใช้งานปัจจุบันของคุณ

    • คุณกําลังใช้พร็อพเพอร์ตี้ Universal Analytics
    • เว็บไซต์ใช้ไลบรารี gtag.js เพื่อส่งเหตุการณ์อีคอมเมิร์ซ
  2. อ่านตัวเลือกการอัปเกรดสําหรับการใช้งานอีคอมเมิร์ซเพื่อเรียนรู้เกี่ยวกับข้อดีข้อเสียของแต่ละตัวเลือก ยืนยันว่าคุณต้องทําตามคู่มือนี้ และติดตั้ง Analytics 2 รายการ ได้แก่ รายการแรกสําหรับพร็อพเพอร์ตี้ Universal Analytics และ 1 รายการสําหรับพร็อพเพอร์ตี้ Google Analytics 4

ข้อดีและข้อเสีย

ตรวจสอบและพิจารณาข้อมูลด้านล่างเพื่อทําความเข้าใจผลของการใช้งานอีคอมเมิร์ซ 2 รายการ อย่างแรกคือพร็อพเพอร์ตี้ Universal Analytics และอีกรายการสําหรับพร็อพเพอร์ตี้ Google Analytics 4

ข้อดี ข้อเสีย
  • ช่วยให้คุณดูข้อมูลอีคอมเมิร์ซได้ทั้งในรายงาน GA4 และ Universal Analytics
  • วิธีการเก็บรวบรวมหรือรายงานข้อมูลอีคอมเมิร์ซในพร็อพเพอร์ตี้ Universal Analytics จะไม่มีการเปลี่ยนแปลง
  • การใช้เหตุการณ์และพารามิเตอร์ GA4 ช่วยรับประกันว่ารายงานอีคอมเมิร์ซ GA4 จะสมบูรณ์
  • กําหนดให้คุณต้องใช้เหตุการณ์อีคอมเมิร์ซของ GA4
  • เว็บไซต์ส่งเหตุการณ์ 2 ชุด ได้แก่ ชุดหนึ่งสําหรับ Universal Analytics และอีกชุดสําหรับ GA4 ซึ่งอาจส่งผลต่อประสิทธิภาพ

การใช้งาน

1. สร้างและกําหนดค่าพร็อพเพอร์ตี้ GA4 ใหม่

ทําตามขั้นตอนต่อไปนี้เพื่อสร้างและกําหนดค่าพร็อพเพอร์ตี้ Google Analytics 4 ใหม่

  1. สร้างพร็อพเพอร์ตี้ Google Analytics 4 ใหม่
    • ใช้ผู้ช่วยการตั้งค่า GA4 เพื่อสร้างพร็อพเพอร์ตี้ GA4 ใหม่โดยอัตโนมัติ และคัดลอกการตั้งค่าต่อไปนี้จากพร็อพเพอร์ตี้ Universal Analytics ได้แก่ ชื่อพร็อพเพอร์ตี้, URL ของเว็บไซต์, เขตเวลา และการตั้งค่าสกุลเงิน อย่างไรก็ตาม ให้ยกเลิกการเลือกตัวเลือกเปิดใช้การรวบรวมข้อมูลโดยใช้แท็กที่มีอยู่ เพื่อปิดใช้ฟีเจอร์แท็กเว็บไซต์ที่เชื่อมต่อ หรือ หากคุณไม่ต้องการคัดลอกการตั้งค่าจากพร็อพเพอร์ตี้ Universal Analytics ให้สร้างพร็อพเพอร์ตี้ Google Analytics 4 โดยไม่ใช้ผู้ช่วยการตั้งค่า GA4
  2. ค้นหารหัสแท็กของพร็อพเพอร์ตี้ Google Analytics 4 ซึ่งจะใช้ในขั้นตอนถัดไปเพื่อกําหนดค่าพร็อพเพอร์ตี้ GA4
  3. เพิ่มพร็อพเพอร์ตี้ GA4
    • หากต้องการให้ระบบส่งเหตุการณ์ Universal Analytics ไปยังพร็อพเพอร์ตี้ UA เท่านั้น และส่งเหตุการณ์ Google Analytics 4 ไปยังพร็อพเพอร์ตี้ GA4 เท่านั้น ให้ใช้ฟังก์ชันข้อมูลเส้นทางที่ gtag.js ให้ไว้
    • เพิ่มพร็อพเพอร์ตี้ Google Analytics 4 ลงในข้อมูลโค้ด gtag.js ที่มีอยู่ ใช้คําสั่ง config และพารามิเตอร์ groups กับรหัสแท็กเพื่อให้กําหนดเส้นทางเหตุการณ์ไปยังพร็อพเพอร์ตี้ GA4 แยกจากพร็อพเพอร์ตี้ Universal Analytics

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

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

  gtag('config', 'UA-XXXXX-Y');  // Universal Analytics property
  gtag('config', 'TAG_ID', { 'groups': 'GA4' });  // Google Analytics 4 property
</script>

2. ใช้เหตุการณ์อีคอมเมิร์ซของ GA4 และกําหนดเส้นทางไปยังพร็อพเพอร์ตี้ GA4

เมื่อสร้างและกําหนดค่าพร็อพเพอร์ตี้ Google Analytics 4 ใหม่เรียบร้อยแล้ว คุณก็พร้อมที่จะนําเหตุการณ์อีคอมเมิร์ซของ GA4 ไปใช้แล้ว หากต้องการช่วยให้การติดตั้งใช้งาน GA4 ของคุณใกล้เคียงกับการใช้งาน Universal Analytics ให้ใช้ทรัพยากรต่อไปนี้

ตัวอย่างต่อไปนี้แสดงเหตุการณ์ purchase ของ Universal Analytics และ Google Analytics 4 แยกกันที่ส่งไปยังพร็อพเพอร์ตี้ที่เกี่ยวข้องโดยใช้พารามิเตอร์ send_to สําหรับเหตุการณ์ GA4

// Universal Analytics.
// The original UA implementation remains unchanged.
gtag('event', 'purchase', {
  "transaction_id": "24.031608523954162",
  "affiliation": "Google online store",
  "currency": "USD",
  "shipping": 7.50,
  "tax": 1.80,
  "value": 33.30,
  "items": [
    {
      "id": "P12345",
      "name": "Android Warhol T-Shirt",
      "brand": "Google",
      "category": "Apparel/T-Shirts",
      "variant": "Black",
      "list_name": "Search Results",
      "list_position": 1,
      "quantity": 2,
      "price": 12.00
    }
  ]
});


// The new Google Analytics 4 ecommerce implementation.
// Uses `send_to` to route data to the GA4 group defined in the tag config.
gtag('event', 'purchase', {
  "send_to": "GA4",
  "transaction_id": "24.031608523954162",
  "affiliation": "Google online store",
  "currency": "USD",
  "shipping": 7.50,
  "tax": 1.80,
  "value": 33.30,
  "items": [
    {
      "item_id": "P12345",
      "item_name": "Android Warhol T-Shirt",
      "item_brand": "Google",
      "item_category": "Apparel/T-Shirts",
      "item_variant": "Black",
      "quantity": 2,
      "price": 12.00
    }
  ],
});