ตั้งค่าเหตุการณ์

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

คู่มือนี้จะแสดงวิธีตั้งค่าเหตุการณ์ที่แนะนําและเหตุการณ์ที่กําหนดเองใน เว็บไซต์โดยใช้แท็ก Google (gtag.js) หรือ Google Tag Manager คุณไม่จําเป็นต้องตั้งค่าเหตุการณ์ที่รวบรวมโดยอัตโนมัติและการวัดที่ปรับปรุงแล้ว

ผู้ชม

คุณได้ตั้งค่า Google Analytics และเริ่มเห็นข้อมูลในรายงานแล้ว แต่ ต้องการรวบรวมข้อมูลมากกว่าที่ Analytics รวบรวมโดยอัตโนมัติ หรือต้องการปลดล็อกฟีเจอร์และความสามารถบางอย่างใน Analytics


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

คู่มือนี้จะถือว่าคุณดำเนินการในข้อต่อไปนี้แล้ว

และจะถือว่าคุณมีสิ่งต่อไปนี้ด้วย

  • การเข้าถึงซอร์สโค้ดของเว็บไซต์
  • บทบาทผู้แก้ไขในบัญชี Google Analytics

ภาพรวมแท็ก Google (gtag.js)

ใช้ API ของแท็ก Google (gtag.js) เพื่อส่ง เหตุการณ์ไปยัง Google Analytics API มีฟังก์ชันหนึ่งชื่อ gtag() และ เมื่อใดก็ตามที่ต้องการส่งเหตุการณ์ไปยัง Google Analytics คุณจะใช้ไวยากรณ์ต่อไปนี้

gtag('event', '<event_name>', {
  <event_parameters>
});

ในตัวอย่างนี้ ฟังก์ชัน gtag() มีองค์ประกอบต่อไปนี้

  • event คําสั่งที่บอก Google ว่าคุณกําลังส่งเหตุการณ์
  • ชื่อของเหตุการณ์ที่แนะนําหรือที่กําหนดเอง
  • (ไม่บังคับ) ชุดพารามิเตอร์ที่ให้ข้อมูลเพิ่มเติม เกี่ยวกับเหตุการณ์

ตัวอย่างเช่น เหตุการณ์ที่แนะนําต่อไปนี้เรียกว่า screen_view โดยมีพารามิเตอร์ 2 รายการ

gtag('event', 'screen_view', {
  'app_name': 'myAppName',
  'screen_name': 'Home'
});

เพิ่มเหตุการณ์ลงใน JavaScript

gtag() เป็นฟังก์ชัน JavaScript ดังนั้นคุณต้องเพิ่มฟังก์ชันลงใน JavaScript ในหน้าเว็บ เช่น คุณอาจเพิ่มฟังก์ชันภายในแท็ก <script> หรือในไฟล์ JavaScript แยกต่างหากที่คุณนำเข้าไปยังหน้า HTML

คุณเพิ่มเหตุการณ์ลงใน JavaScript ได้ทุกที่ด้านล่างข้อมูลโค้ดแท็ก Google Google จะไม่ประมวลผลข้อมูลจากเหตุการณ์ที่คุณวางไว้เหนือข้อมูลโค้ดแท็ก Google ตัวอย่างเช่น โค้ดตัวอย่างต่อไปนี้มีเหตุการณ์ชื่อ screen_view ภายในแท็ก <script>

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

    gtag('config', 'G-XXXXXXXXXX');
    </script>

    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Title of the page</title>
</head>
<body>
    <p>Welcome to my website!</p>
    
    <script>
      /**
      *   The following event is sent when the page loads. You could
      *   wrap the event in a JavaScript function so the event is
      *   sent when the user performs some action.
      */
      gtag('event', 'screen_view', {
        'app_name': 'myAppName',
        'screen_name': 'Home'
      });
    </script> 
</body>
</html>

หากต้องการส่งเหตุการณ์ตามการคลิกปุ่ม (หรือการกระทําอื่นๆ ของผู้ใช้) คุณสามารถเพิ่ม JavaScript บางอย่างลงในเหตุการณ์ได้

ดูเหตุการณ์ใน Analytics

คุณดูเหตุการณ์และพารามิเตอร์ของเหตุการณ์ได้โดยใช้รายงานแบบเรียลไทม์และ DebugView โปรดทราบว่ารายงาน DebugView กำหนดให้ต้องมีการกำหนดค่าเพิ่มเติมบางอย่างก่อนที่คุณจะใช้รายงานได้ รายงานทั้ง 2 ฉบับนี้จะแสดง เหตุการณ์ที่ผู้ใช้เรียกให้แสดงบนเว็บไซต์เมื่อระบบเรียกเหตุการณ์ให้แสดง

ขั้นตอนถัดไป