วิธีตั้งค่าการติดตามอีคอมเมิร์ซ GA4 บน Shopify

เผยแพร่แล้ว: 2022-07-19

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

อ่านขั้นตอนง่ายๆ ในการตั้งค่าการติดตามอีคอมเมิร์ซ GA4 บนเว็บไซต์ Shopify โดยไม่ต้องติดตั้งแอปหรือใช้นักพัฒนา

แม้ว่าทุกคนจะสามารถปฏิบัติตามคู่มือนี้ได้ แต่จะง่ายกว่าถ้าคุณมีความเข้าใจพื้นฐานเกี่ยวกับวิธีการทำงานของ GTM

สร้างชั้นข้อมูลใน Shopify

งานแรกของเราคือการสร้างชั้นข้อมูล ชั้นข้อมูลเป็นโค้ดง่ายๆ ที่มีข้อมูลเกี่ยวกับเซสชันเว็บไซต์ของผู้เข้าชม ข้อมูลนี้สามารถส่งต่อไปยังแพลตฟอร์มอื่นๆ เช่น GTM

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

คัดลอกและวางสคริปต์ด้านล่างลงในช่องสคริปต์ "ชำระเงิน" ในการตั้งค่า Shopify admin สามารถพบได้โดยไปที่ 'การตั้งค่า > การชำระเงินและบัญชี > สคริปต์เพิ่มเติม'
ชั้นข้อมูลนี้จะพุชเหตุการณ์ 'การซื้อ' ไปยัง GTM ที่มีข้อมูลเกี่ยวกับคำสั่งซื้อของลูกค้า

 {% if first_time_accessed %} <script> dataLayer.push({ ecommerce: null }); // Clear the previous ecommerce object. window.dataLayer.push({ 'event': 'purchase', ecommerce: { 'transaction_id': '{{ order.name || order.order_number }}', 'value': {{ total_price | money_without_currency | remove:',' }}, // Includes tax & shipping 'tax': {{ tax_price | money_without_currency | remove:',' }}, 'shipping': {{ shipping_price | money_without_currency | remove:',' }}, 'currency': '{{ shop.currency }}', 'payment_type': '{{ order.transactions[0].gateway }}', //optional parameter 'items': [ {% for line_item in line_items %} { 'item_id': '{{ line_item.sku || line_item.product_id }}', //if no SKU exists, use product Id 'item_name': '{{ line_item.product.title }}', 'discount': {{ line_item.line_level_total_discount | money_without_currency }}, 'item_variant': '{{ line_item.variant.title }}', 'price': {{ line_item.final_price | money_without_currency }}, 'quantity': {{ line_item.quantity }} }, {% endfor %} ]} }); </script> {% endif %}**

สร้างทริกเกอร์การยิงใน GTM

ตอนนี้ เราต้องตั้งค่าทริกเกอร์ที่จะเริ่มทำงานเมื่อลูกค้าทำการสั่งซื้อเสร็จสิ้น เมื่อทริกเกอร์เริ่มทำงาน แท็กที่มีข้อมูลคำสั่งซื้อจะถูกส่งไปยัง GA4

เราจำเป็นต้องกำหนดเงื่อนไขที่ทริกเกอร์การซื้อของเราเริ่มทำงาน เงื่อนไขสำหรับทริกเกอร์ของเราคือเมื่อมีการผลักเหตุการณ์การซื้อในชั้นข้อมูลของเรา ในการตั้งค่านี้:

เข้าสู่ระบบ GTM ไปที่เมนูด้านซ้ายและเลือก 'Triggers'
กดปุ่ม 'ใหม่' สีน้ำเงิน
เรียกทริกเกอร์ของคุณ 'GA4 - ซื้อ'
กดไอคอน 'แก้ไข' ที่มุมของหน้าต่าง 'การกำหนดค่าทริกเกอร์'
ภายใต้ 'เลือกประเภททริกเกอร์' เลือก 'เหตุการณ์ที่กำหนดเอง'
ในฟิลด์ 'ชื่อเหตุการณ์' ให้พิมพ์ 'การซื้อ'
ตั้งค่า 'ทริกเกอร์นี้เริ่มทำงาน' เป็น 'บางเหตุการณ์ที่กำหนดเอง'
กำหนดเงื่อนไขเหตุการณ์เป็น:
กิจกรรม - เท่ากับ - ซื้อ

เมื่อเสร็จแล้วควรมีลักษณะดังนี้:

สร้างตัวแปรชั้นข้อมูลใน GTM

ก่อนที่เราจะตั้งค่าแท็ก เราจำเป็นต้องสร้างตัวแปร GTM เพื่อดึงข้อมูลจากชั้นข้อมูลของเรา หากตัวแปรเป็นตัวแปรใหม่สำหรับคุณ ให้คิดว่าตัวแปรเหล่านี้เป็นแพ็กเก็ตที่มีข้อมูลเล็กน้อย

ค่าเฉพาะจากชั้นข้อมูลจะถูกเพิ่มเข้าไปในตัวแปรเหล่านี้ และค่าเหล่านี้จะถูกส่งไปยัง GA4

เราจำเป็นต้องสร้างตัวแปรเพื่อดึงค่าต่อไปนี้ออกจากชั้นข้อมูลของคุณ:

รายได้จากการสั่งซื้อ
รหัสคำสั่งซื้อ
สกุลเงิน
ภาษี
ค่าขนส่ง
รายการที่ซื้อ
ใน GTM จากเมนูด้านซ้าย ให้คลิกไปที่หน้า 'ตัวแปร'
ในช่อง 'ตัวแปรที่กำหนดโดยผู้ใช้' ให้คลิกที่ปุ่ม 'ใหม่'
ในหน้าจอนี้ คุณสามารถสร้างตัวแปร GTM ใหม่ได้ คุณต้องทำตามขั้นตอนต่อไปนี้สำหรับตัวแปรแต่ละตัวที่แสดงด้านบน รายละเอียดสำหรับตัวแปรแต่ละตัวมีดังต่อไปนี้:

รายได้จากการสั่งซื้อ

ชื่อ: dlv - Thank You Page - Order Revenue

การกำหนดค่าตัวแปร: