Web Tracking Code

Tài liệu này hướng dẫn bạn từng bước thực hiện thêm code tracking vào website để ghi nhận dữ liệu người dùng từ website về PangoCDP như User Cookie info, User Activities, Traffic Source, ...

Tổng quan

PangoCDP cung cấp đoạn mã <Code tracking> để bạn gắn vào website, thông qua đoạn mã này Pango sẽ ghi nhận các dữ liệu từ webiste như thông tin cookie của user, thông tin tương tác của họ như xem trang, bấm vào các mục có gắn sự kiện trên site, thông tin về nguuồn truy cập của user.

1. Tạo Measurement ID trên GA4

Measurement ID là mã đo lường trong Google Analytics. Để tạo làm theo các bước sau

Tạo mã đo lượng Measurement ID - Xem hướng dẫn tại đây
Copy Measurement ID vừa tạo để sử dụng cho bước Web Tracking Code
Copy mã Measurement ID bạn vừa tạo

2. Tạo Facebook Pixel

Tạo Facebook Pixlel - Xem hướng dẫn tại đây
Copy Pixel Id để sử dụng cho bước Web Tracking Code
Copy mã Pixel ID bạn vừa tạo

3. Gắn code tracking Pango vào website

Copy đoạn code bên dưới thêm vào website của bạn <head> code </head>.

<script>window.dataLayer=window.dataLayer||[],dataLayer.push({measurementId:"MeasurementID",fbPixelId:"FacebookPixelId",orgId:"OrganizationID",enableGA4:!0,enableMetaPixel:!0,userId:"InternalUserId"}),function(b,d,e,a,g){b[a]=b[a]||[],b[a].push({"gtm.start":new Date().getTime(),event:"gtm.js"});var f=d.getElementsByTagName(e)[0],c=d.createElement(e);c.async=!0,c.src="https://www.googletagmanager.com/gtm.js?id="+g+("dataLayer"!=a?"&l="+a:""),f.parentNode.insertBefore(c,f)}(window,document,"script","dataLayer","GTM-M6MNVJG")</script>

Lưu ý: Bạn cần thay đổi các thông tin sau

Measurement ID (đã copy ở bước 1. Tạo Measurement ID trên GA4)
Facebook Pixel Id (đã copy ở bước 2. Tạo Facebook Pixel)
Organization ID: Mã này được cung cấp bởi Pango Team
Internal User ID: Là User ID của website (vd: Phone hoặc Email)

4. Event Tracking

Đề xuất event của Google Analytics 4

Xem danh sách event đề xuất từ Google Xem Analytics 4 tại đây

Enhanced E-Commerce

Xem danh sách các event để đo lường cảu Google Analytics 4 dành cho e-commerce tại đây

Client Tracking Events

select_item

Sử dụng khi người dùng chọn một mục từ danh sách, hãy gửi sự kiện select_item với mục đã chọn trong tham số như bên dưới

dataLayer.push({
    'event': 'pangoTrack',
    'eventAction': 'select_item',
    item_list_id: "related_products",
    item_list_name: "Related products",
    ecommerce: {
        items: [{
            item_id: "SKU_12345",
            item_name: "Stan and Friends Tee",
            affiliation: "Google Merchandise Store",
            coupon: "SUMMER_FUN",
            currency: "USD",
            discount: 2.22,
            index: 0,
            item_brand: "Google",
            item_category: "Apparel",
            item_category2: "Adult",
            item_category3: "Shirts",
            item_category4: "Crew",
            item_category5: "Short sleeve",
            item_list_id: "related_products",
            item_list_name: "Related Products",
            item_variant: "green",
            location_id: "L_12345",
            price: 9.99,
            quantity: 1
        }]
    }
})

view_item

Để đo số lần xem chi tiết mặt hàng, hãy gửi sự kiện view_item bất cứ khi nào người dùng xem màn hình chi tiết của mặt hàng.

dataLayer.push({
    'event': 'pangoTrack',
    'eventAction': 'view_item',
    ecommerce: {
        items: [{
            item_id: "SKU_12345",
            item_name: "Stan and Friends Tee",
            affiliation: "Google Merchandise Store",
            coupon: "SUMMER_FUN",
            currency: "USD",
            discount: 2.22,
            index: 0,
            item_brand: "Google",
            item_category: "Apparel",
            item_category2: "Adult",
            item_category3: "Shirts",
            item_category4: "Crew",
            item_category5: "Short sleeve",
            item_list_id: "related_products",
            item_list_name: "Related Products",
            item_variant: "green",
            location_id: "L_12345",
            price: 9.99,
            quantity: 1
        }]
    }
})

view_item_list

Khi người dùng nhận được danh sách kết quả, hãy gửi sự kiện view_item_list bao gồm tham số mảng items chứa các mục hiển thị

dataLayer.push({
    'event': 'pangoTrack',
    'eventAction': 'view_item_list',
    item_list_id: "related_products",
    item_list_name: "Related products",
    ecommerce: {
        items: [{
            item_id: "SKU_12345",
            item_name: "Stan and Friends Tee",
            affiliation: "Google Merchandise Store",
            coupon: "SUMMER_FUN",
            currency: "USD",
            discount: 2.22,
            index: 0,
            item_brand: "Google",
            item_category: "Apparel",
            item_category2: "Adult",
            item_category3: "Shirts",
            item_category4: "Crew",
            item_category5: "Short sleeve",
            item_list_id: "related_products",
            item_list_name: "Related Products",
            item_variant: "green",
            location_id: "L_12345",
            price: 9.99,
            quantity: 1
        }]
    }
})

add_to_cart

Đo lường một mặt hàng đang được thêm vào giỏ hàng bằng cách gửi sự kiện add_to_cart với các mặt hàng có liên quan trong một mảng mặt hàng.

dataLayer.push({
    'event': 'pangoTrack',
    'eventAction': 'add_to_cart',
    ecommerce: {
        items: [{
            item_id: "SKU_12345",
            item_name: "Stan and Friends Tee",
            affiliation: "Google Merchandise Store",
            coupon: "SUMMER_FUN",
            currency: "USD",
            discount: 2.22,
            index: 0,
            item_brand: "Google",
            item_category: "Apparel",
            item_category2: "Adult",
            item_category3: "Shirts",
            item_category4: "Crew",
            item_category5: "Short sleeve",
            item_list_id: "related_products",
            item_list_name: "Related Products",
            item_variant: "green",
            location_id: "L_12345",
            price: 9.99,
            quantity: 1
        }]
    }
})

remove_from_cart

Để đo thời điểm người dùng xóa một mặt hàng khỏi giỏ hàng, hãy gửi sự kiện remove_from_cart

dataLayer.push({
    'event': 'pangoTrack',
    'eventAction': 'remove_from_cart',
    ecommerce: {
        items: [{
            item_id: "SKU_12345",
            item_name: "Stan and Friends Tee",
            affiliation: "Google Merchandise Store",
            coupon: "SUMMER_FUN",
            currency: "USD",
            discount: 2.22,
            index: 0,
            item_brand: "Google",
            item_category: "Apparel",
            item_category2: "Adult",
            item_category3: "Shirts",
            item_category4: "Crew",
            item_category5: "Short sleeve",
            item_list_id: "related_products",
            item_list_name: "Related Products",
            item_variant: "green",
            location_id: "L_12345",
            price: 9.99,
            quantity: 1
        }]
    }
})

add_to_wishlist

Bạn cũng có thể đo lường thời điểm một mặt hàng được thêm vào danh sách yêu thích bằng cách gửi sự kiện add_to_wishlist với các mặt hàng có liên quan trong một mảng mặt hàng.

dataLayer.push({
    'event': 'pangoTrack',
    'eventAction': 'add_to_wishlist',
    ecommerce: {
        items: [{
            item_id: "SKU_12345",
            item_name: "Stan and Friends Tee",
            affiliation: "Google Merchandise Store",
            coupon: "SUMMER_FUN",
            currency: "USD",
            discount: 2.22,
            index: 0,
            item_brand: "Google",
            item_category: "Apparel",
            item_category2: "Adult",
            item_category3: "Shirts",
            item_category4: "Crew",
            item_category5: "Short sleeve",
            item_list_id: "related_products",
            item_list_name: "Related Products",
            item_variant: "green",
            location_id: "L_12345",
            price: 9.99,
            quantity: 1
        }]
    }
})

view_cart

Khi người dùng xem giỏ hàng, hãy gửi sự kiện view_cart với tất cả các mặt hàng trong giỏ hàng

dataLayer.push({
    'event': 'pangoTrack',
    'eventAction': 'view_cart',
    ecommerce: {
        items: [{
            item_id: "SKU_12345",
            item_name: "Stan and Friends Tee",
            affiliation: "Google Merchandise Store",
            coupon: "SUMMER_FUN",
            currency: "USD",
            discount: 2.22,
            index: 0,
            item_brand: "Google",
            item_category: "Apparel",
            item_category2: "Adult",
            item_category3: "Shirts",
            item_category4: "Crew",
            item_category5: "Short sleeve",
            item_list_id: "related_products",
            item_list_name: "Related Products",
            item_variant: "green",
            location_id: "L_12345",
            price: 9.99,
            quantity: 1
        }]
    }
})

begin_checkout

Đo lường bước đầu tiên trong quy trình thanh toán bằng cách gửi sự kiện begin_checkout với một hoặc nhiều mục được xác định bằng các trường có liên quan. Ở giai đoạn này, phiếu giảm giá cũng có thể được thêm vào toàn bộ đơn hàng bằng cách thêm nó vào sự kiện hoặc áp dụng cho một mặt hàng cụ thể bằng cách thêm nó vào các thành phần cụ thể trong mảng mặt hàng

dataLayer.push({
    'event': 'pangoTrack',
    'eventAction': 'begin_checkout',
    currency: "USD",
    value: 7.77,
    coupon: "SUMMER_FUN",
    ecommerce: {
        items: [{
            item_id: "SKU_12345",
            item_name: "Stan and Friends Tee",
            affiliation: "Google Merchandise Store",
            coupon: "SUMMER_FUN",
            currency: "USD",
            discount: 2.22,
            index: 0,
            item_brand: "Google",
            item_category: "Apparel",
            item_category2: "Adult",
            item_category3: "Shirts",
            item_category4: "Crew",
            item_category5: "Short sleeve",
            item_list_id: "related_products",
            item_list_name: "Related Products",
            item_variant: "green",
            location_id: "L_12345",
            price: 9.99,
            quantity: 1
        }]
    }
})

add_payment_info

Gửi sự kiện add_ payment_info khi người dùng gửi thông tin thanh toán của họ. Nếu có thể, hãy bao gồm payment_type với sự kiện này cho phương thức thanh toán đã chọn

dataLayer.push({
    'event': 'pangoTrack',
    'eventAction': 'add_payment_info',
    ecommerce: {
        currency: "USD",
        value: 7.77,
        coupon: "SUMMER_FUN",
        payment_type: "Credit Card",
        items: [{
            item_id: "SKU_12345",
            item_name: "Stan and Friends Tee",
            affiliation: "Google Merchandise Store",
            coupon: "SUMMER_FUN",
            currency: "USD",
            discount: 2.22,
            index: 0,
            item_brand: "Google",
            item_category: "Apparel",
            item_category2: "Adult",
            item_category3: "Shirts",
            item_category4: "Crew",
            item_category5: "Short sleeve",
            item_list_id: "related_products",
            item_list_name: "Related Products",
            item_variant: "green",
            location_id: "L_12345",
            price: 9.99,
            quantity: 1
        }]
    }
})

add_shipping_info

Khi người dùng chuyển sang bước tiếp theo trong quy trình thanh toán và thêm thông tin vận chuyển, hãy gửi sự kiện add_shipping_info. Sử dụng thông số shipping_tier để chỉ định tùy chọn giao hàng của người dùng, chẳng hạn như "Đường bộ", "Đường hàng không" hoặc "Ngày hôm sau"

dataLayer.push({
    'event': 'pangoTrack',
    'eventAction': 'add_shipping_info',
    ecommerce: {
        currency: "USD",
        value: 7.77,
        coupon: "SUMMER_FUN",
        shipping_tier: "Ground",
        items: [{
            item_id: "SKU_12345",
            item_name: "Stan and Friends Tee",
            affiliation: "Google Merchandise Store",
            coupon: "SUMMER_FUN",
            currency: "USD",
            discount: 2.22,
            index: 0,
            item_brand: "Google",
            item_category: "Apparel",
            item_category2: "Adult",
            item_category3: "Shirts",
            item_category4: "Crew",
            item_category5: "Short sleeve",
            item_list_id: "related_products",
            item_list_name: "Related Products",
            item_variant: "green",
            location_id: "L_12345",
            price: 9.99,
            quantity: 1
        }]
    },
    user_data: {
        email_address: '[email protected]',
        phone_number: '1234567890',
        address: {
            first_name: 'john',
            last_name: 'smith',
            city: 'menlopark',
            region: 'ca',
            district: '',
            ward: '',
            postal_code: '94025',
            country: 'usa'
        },
        'form_key': '',
        'form_name': '',
        'form_vs': '', //form version,
        'cf': '' //custom field
    },
    'cdpData': {
        properties: {
            'gender': 'male',
            'birthYear': '2000'
        }
    }
})

purchase

Đo lường giao dịch mua hàng bằng cách gửi sự kiện purchase với một hoặc nhiều mặt hàng được xác định bằng các trường liên quan

dataLayer.push({
    'event': 'pangoTrack',
    'eventAction': 'purchase',
    ecommerce: {
        transaction_id: "T_12345",
        affiliation: "Google Merchandise Store",
        value: 25.42,
        tax: 4.90,
        shipping: 5.99,
        currency: "USD",
        coupon: "SUMMER_SALE",
        items: [{
                item_id: "SKU_12345",
                item_name: "Stan and Friends Tee",
                affiliation: "Google Merchandise Store",
                coupon: "SUMMER_FUN",
                currency: "USD",
                discount: 2.22,
                index: 0,
                item_brand: "Google",
                item_category: "Apparel",
                item_category2: "Adult",
                item_category3: "Shirts",
                item_category4: "Crew",
                item_category5: "Short sleeve",
                item_list_id: "related_products",
                item_list_name: "Related Products",
                item_variant: "green",
                location_id: "L_12345",
                price: 9.99,
                quantity: 1
            },
            {
                item_id: "SKU_12346",
                item_name: "Google Grey Women's Tee",
                affiliation: "Google Merchandise Store",
                coupon: "SUMMER_FUN",
                currency: "USD",
                discount: 3.33,
                index: 1,
                item_brand: "Google",
                item_category: "Apparel",
                item_category2: "Adult",
                item_category3: "Shirts",
                item_category4: "Crew",
                item_category5: "Short sleeve",
                item_list_id: "related_products",
                item_list_name: "Related Products",
                item_variant: "gray",
                location_id: "L_12345",
                price: 20.99,
                promotion_id: "P_12345",
                promotion_name: "Summer Sale",
                quantity: 1
            }
        ]
    }
})

generate_lead

Đo lường hành động người dùng gửi biểu mẫu trong trang, sử dụng cdpData.properties cho các biến không được xác định trong user_data

dataLayer.push({
    'event': 'pangoTrack',
    'eventAction': 'generate_lead',
    user_data: {
        email_address: '[email protected]',
        phone_number: '1234567890',
        address: {
            first_name: 'john',
            last_name: 'smith',
            city: 'menlopark',
            region: 'ca',
            postal_code: '94025',
            country: 'usa'
        },
        'form_key': '',
        'form_name': '',
        'form_vs': '', //form version,
        'cf': 'cf_01=Value || cf_ts_02=Value || cf_ls_01=["tag1", "tag2"]',
    },
    'cdpData': {
        properties: {
            'gender': 'male',
            'birthYear': '2000'
        }
    }
});

// Timestamp: cf_ts_01, cf_ts_02,...
// Boolean: cf_b_01, cf_b_02
// Double: cf_d_01, cf_d_02
// Long: cf_l_01, cf_l_02
// ListL: ["tag1", "tag2"] : cf_ls_01, cf_ls_02, cf_ls_03
// Text: cf_01, cf_02, cf_03

select_promotion

Để cho biết người dùng đã nhấp vào một chương trình khuyến mãi, hãy gửi sự kiện select_promotion với mặt hàng đó làm thông số mặt hàng

dataLayer.push({
    'event': 'pangoTrack',
    'event': 'select_promotion',
    creative_name: "Summer Banner",
    creative_slot: "featured_app_1",
    location_id: "L_12345",
    promotion_id: "P_12345",
    promotion_name: "Summer Sale",
    'ecommerce': {
        'items': [{
            'item_name': 'Tri Blend Android T-Shirt', //One of item_id or  item_name is required for product or impression data. 
            'item_id': '123',
            'promotion_id': '12345',
            'price': '15.25',
            'item_brand': 'Google',
            'item_category': 'Apparel',
            'item_variant': 'Gray',
            'promotion_id': 'p1',
            'promotion_name': 'p1 name',
            'creative_name': 'creative name',
            'creative_slot': 'right',
            'location_id': 'l_11',
            'index': 1,
            'quantity': 1
        }]
    }
});

view_promotion

Thương mại điện tử bao gồm hỗ trợ đo lường số lần hiển thị và số lần nhấp chuột của các chương trình khuyến mãi nội bộ, chẳng hạn như các biểu ngữ được hiển thị để quảng cáo bán hàng.

Số lần hiển thị quảng cáo thường được đo bằng lượt xem màn hình ban đầu bằng cách gửi sự kiện view_promotion cùng với thông số mặt hàng để chỉ định mặt hàng được quảng cáo.

dataLayer.push({
    'event': 'pangoTrack',
    'event': 'view_promotion',
    creative_name: "Summer Banner",
    creative_slot: "featured_app_1",
    location_id: "L_12345",
    promotion_id: "P_12345",
    promotion_name: "Summer Sale",
    'ecommerce': {
        'items': [{
            'item_name': 'Tri Blend Android T-Shirt', //One of item_id or  item_name is required for product or impression data. 
            'Item_id': '123',
            'promotion_id': '12345',
            'price': '15.25',
            'item_brand': 'Google',
            'item_category': 'Apparel',
            'item_variant': 'Gray',
            'promotion_id': 'p1',
            'promotion_name': 'p1 name',
            'creative_name': 'creative name',
            'creative_slot': 'right',
            'location_id': 'l_11',
            'index': 1,
            'quantity': 1
        }]
    }
});

custom_event

Đo lường các sự kiện tùy chỉnh theo nhu cầu trong trang. Lưu ý quan trọng: {{custom_event}} và các biến thuộc tính cần phải là biểu thức chính quy [A-Za-z0-9_-]

dataLayer.push({
    'event': 'pangoTrack',
    'eventAction': '{{custom_event}}',
    user_data: {
       always_use: true, //PangoCDP will be identify user, default identify for only generate_lead event
       email_address: '[email protected]',
       phone_number: '1234567890',
    },
    'cdpData': {
        properties: {
            'objectType': 'banner',
            'objectId': 'banner1'
        }
    }
})

PreviousVIE Version NextData Ingestion APIs

Last updated 28 days ago

Was this helpful?

hashtagTổng quan

hashtag1. Tạo Measurement ID trên GA4

hashtag2. Tạo Facebook Pixel

hashtag3. Gắn code tracking Pango vào website

hashtag4. Event Tracking

hashtagĐề xuất event của Google Analytics 4

hashtagEnhanced E-Commerce

hashtagClient Tracking Events

hashtagselect_item

hashtagview_item

hashtagview_item_list

hashtagadd_to_cart

hashtagremove_from_cart

hashtagadd_to_wishlist

hashtagview_cart

hashtagbegin_checkout

hashtagadd_payment_info

hashtagadd_shipping_info

hashtagpurchase

hashtaggenerate_lead

hashtagselect_promotion

hashtagview_promotion

hashtagcustom_event