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

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

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

ผลลัพธ์

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

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

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

    • คุณกําลังใช้พร็อพเพอร์ตี้ Universal Analytics
    • เว็บไซต์ใช้ไลบรารี gtag.js เพื่อส่งเหตุการณ์อีคอมเมิร์ซ

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

  3. อ่านข้อมูลอ้างอิงความเข้ากันได้ของเหตุการณ์เพื่อดูวิธีแปลเหตุการณ์ UA เมื่อส่งไปยังพร็อพเพอร์ตี้ GA4

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

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

ข้อดี ข้อเสีย
  • ตัวเลือกที่ง่ายที่สุดในการนําไปใช้ เนื่องจากคุณไม่ได้เปลี่ยนแท็กเหตุการณ์อีคอมเมิร์ซที่มีอยู่
  • ช่วยให้คุณดูข้อมูลอีคอมเมิร์ซได้ทั้งในรายงาน GA4 และ Universal Analytics
  • วิธีการเก็บรวบรวมหรือรายงานข้อมูลอีคอมเมิร์ซในพร็อพเพอร์ตี้ Universal Analytics จะไม่มีการเปลี่ยนแปลง
  • ระบบไม่รู้จักเหตุการณ์ select_content, checkout_progress, set_checkout_option และ view_refund ใน GA4 และจะไม่ปรากฏในรายงานอีคอมเมิร์ซของ GA4
    • ระบบจะถือว่าเหตุการณ์ข้างต้นและพารามิเตอร์ที่เชื่อมโยงเป็นเหตุการณ์ที่กําหนดเองและพารามิเตอร์ที่กําหนดเองใน GA4 แต่จะไม่มีการส่งข้อมูลไปยัง Google Analytics สําหรับพารามิเตอร์ items (ระบบไม่รองรับพารามิเตอร์นี้เป็นพารามิเตอร์ที่กําหนดเอง)
  • ขั้นตอนเพิ่มข้อมูลการจัดส่งในรายงานช่องทางรถเข็นของ GA4/รายละเอียดช่องทางสํารองจะว่างเปล่า
  • ขั้นตอนการคลิกรายการในรายงานช่องทางสินค้า/ผลิตภัณฑ์/รายการ GA4 จะว่างเปล่า
  • ระบบไม่รู้จักตัวคั่น / สําหรับหมวดหมู่ใน GA4 GA4 จะรายงานเป็น cat1/cat2/cat3 เป็นหมวดหมู่แทนที่จะเป็น 3 หมวดหมู่ เช่น cat1, cat2 และ cat3

การใช้งาน

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

ตัวเลือกที่ 1: ใช้ผู้ช่วยการตั้งค่า GA4 และเปิดใช้แท็กเว็บไซต์ที่เชื่อมต่อ

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

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

ตัวเลือกที่ 2: อัปเดตข้อมูลโค้ด gtag.js

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

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

<!-- 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');  // Google Analytics 4 property.
  
</script>