Chuyển đến nội dung chính

Tích Hợp Google Tag Manager

Trong hướng dẫn này: Học cách triển khai conversion tracking của Li2 sử dụng Google Tag Manager - không cần thay đổi code.

Google Tag Manager

Google Tag Manager (GTM) là cách phổ biến nhất để triển khai conversion tracking của Li2 mà không cần động vào code của website. Phương pháp này lý tưởng cho marketers muốn kiểm soát tracking mà không phụ thuộc vào developers.

Prerequisites

Bắt buộc: Website của bạn phải đã cài đặt Google Tag Manager. Nếu chưa, hãy làm theo hướng dẫn cài đặt GTM của Google trước.
Trước khi bắt đầu, đảm bảo bạn có:

GTM Container

GTM script đã được cài trên website

Conversion Tracking Enabled

Đã bật trong touchpoint settings (xem Setup Guide)

Publishable Key

Lấy từ Settings → Analytics

GTM Edit Access

Quyền tạo tags và variables

GTM Setup: Cài Đặt Li2 SDK

Bước 1: Tạo Custom HTML Tag

1

Mở GTM Container

Đăng nhập vào Google Tag Manager và chọn container của bạn
2

Tạo Tag Mới

Click TagsNew → Đặt tên “Li2 Analytics - SDK Loader”
3

Cấu Hình Tag

  1. Tag Type: Chọn Custom HTML
  2. HTML Content: Paste script bên dưới
  3. Triggering: Chọn All Pages
Script cần paste:
<script>
!(function (c, n) {
  c[n] = c[n] || function () {
    (c[n].q = c[n].q || []).push(arguments);
  };
  var methods = ["trackLead", "trackSale"];
  for (var i = 0; i < methods.length; i++) {
    (function(method) {
      c[n][method] = function() {
        var args = Array.prototype.slice.call(arguments);
        c[n].apply(c[n], [method].concat(args));
      };
    })(methods[i]);
  }
  var s = document.createElement("script");
  s.defer = 1;
  s.src = "https://unpkg.com/@li2/analytics/dist/index.global.js";
  s.setAttribute("data-publishable-key", "li2_pk_xxxxxxxx");
  document.head.appendChild(s);
})(window, "li2Analytics");
</script>
QUAN TRỌNG: Thay li2_pk_xxxxxxxx bằng publishable key thực tế từ Settings → Analytics trong Li2 dashboard.
Tại sao trigger All Pages? SDK cần load trên mọi trang để:
  • Capture click IDs khi users đến từ touchpoints của bạn
  • Làm cho li2Analytics object khả dụng để track events
  • Set cookie li_cid cho attribution

Bước 2: Tạo Click ID Variable

Variable này đọc cookie li_cid được set bởi Li2 khi users click vào touchpoint links.
1

Tạo Variable Mới

Click VariablesUser-Defined VariablesNew
2

Cấu Hình Variable

  1. Variable Type: 1st Party Cookie
  2. Cookie Name: li_cid
  3. Variable Name: “Li2 Click ID”
3

Lưu Variable

Click Save. Bây giờ bạn có thể reference nó là {{Li2 Click ID}} trong tags

GTM Lead Tracking

Track khi users sign up, đăng ký, hoặc thể hiện quan tâm đến sản phẩm/dịch vụ của bạn.

Option 1: Thank You Page Tracking (Khuyến Nghị)

Khi nào dùng: Bạn redirect users đến thank you page sau khi submit form (VD: /thank-you, /success, /welcome)
1

Tạo Tag Mới

TagsNew → Name: “Li2 - Track Lead - Thank You Page”
2

Cấu Hình Tag Type

Chọn Custom HTML và paste script bên dưới
3

Set Up Trigger

TriggeringNew Trigger:
  • Trigger Type: Page View
  • This trigger fires on: Some Page Views
  • Condition: Page URL contains /thank-you (điều chỉnh theo URL của bạn)
Script:
<script>
(function() {
  // Extract thông tin user từ URL parameters (pattern phổ biến)
  var params = new URLSearchParams(window.location.search);
  var email = params.get("email");
  var name = params.get("name");

  // Lấy click ID từ GTM variable
  var clickId = {{Li2 Click ID}} || "";

  // Chỉ track nếu có cả email và clickId
  if (email && clickId) {
    li2Analytics.trackLead({
      eventName: "Sign Up",
      customerExternalId: email,
      customerName: name || email,
      customerEmail: email,
      clickId: clickId
    });
  }
})();
</script>
Customize cho use case của bạn:
  • Nếu customer info trong localStorage hoặc sessionStorage, lấy từ đó
  • Nếu dùng data layer, đọc từ dataLayer.push() variables
  • Nếu form cùng trang, đọc từ DOM elements (xem Option 2)

Option 2: Form Submission Tracking

Khi nào dùng: Bạn muốn track ngay khi form được submit (không có redirect)
1

Tạo Tag Mới

TagsNew → Name: “Li2 - Track Lead - Form Submission”
2

Cấu Hình Tag Type

Chọn Custom HTML và paste script bên dưới
3

Set Up Trigger

TriggeringNew Trigger:
  • Trigger Type: Form Submission
  • This trigger fires on: Specific forms (dùng form ID hoặc class)
  • Wait for Tags: Check “Wait for Tags” với max wait time 2000ms
Script:
<script>
(function() {
  // Lấy giá trị form fields (điều chỉnh selectors cho phù hợp với form của bạn)
  var nameField = document.getElementById("name");
  var emailField = document.getElementById("email");
  var name = nameField ? nameField.value : "";
  var email = emailField ? emailField.value : "";

  // Lấy click ID từ GTM variable
  var clickId = {{Li2 Click ID}} || "";

  // Chỉ track nếu có cả email và clickId
  if (email && clickId) {
    li2Analytics.trackLead({
      eventName: "Sign Up",
      customerExternalId: email,
      customerName: name || email,
      customerEmail: email,
      clickId: clickId
    });
  }
})();
</script>
QUAN TRỌNG: Cập nhật DOM selectors (getElementById, querySelector) cho phù hợp với form field IDs hoặc classes thực tế. Inspect form HTML của bạn để tìm selectors chính xác.

GTM Sale Tracking

Track revenue khi khách hàng mua hàng.

Option 1: Order Confirmation Page (Khuyến Nghị)

Khi nào dùng: Bạn redirect users đến order confirmation page sau khi thanh toán thành công (VD: /order-confirmation, /checkout/success)
1

Tạo Tag Mới

TagsNew → Name: “Li2 - Track Sale - Order Confirmation”
2

Cấu Hình Tag Type

Chọn Custom HTML và paste script bên dưới
3

Set Up Trigger

TriggeringNew Trigger:
  • Trigger Type: Page View
  • This trigger fires on: Some Page Views
  • Condition: Page URL contains /order-confirmation (điều chỉnh theo URL của bạn)
Script:
<script>
(function() {
  // Extract order info từ URL parameters (phổ biến cho payment gateways)
  var params = new URLSearchParams(window.location.search);
  var customerId = params.get("customer_id");
  var amount = params.get("amount");
  var invoiceId = params.get("invoice_id") || params.get("order_id");

  // Lấy click ID từ GTM variable
  var clickId = {{Li2 Click ID}} || "";

  // Chỉ track nếu có đủ required fields
  if (customerId && amount && clickId) {
    li2Analytics.trackSale({
      eventName: "Purchase",
      customerExternalId: customerId,
      amount: parseInt(amount), // Amount tính bằng cents (VD: 4999 = $49.99)
      invoiceId: invoiceId || undefined,
      currency: "usd", // Đổi thành "vnd" nếu cần
      paymentProcessor: "stripe", // Hoặc "paypal", "paddle", etc.
      clickId: clickId
    });
  }
})();
</script>
Format Amount: Amount phải là đơn vị nhỏ nhất của tiền tệ (cents cho USD, đồng cho VND):
  • ✅ ĐÚNG: amount: 4999 = $49.99
  • ❌ SAI: amount: 49.99 = $0.49

Option 2: E-commerce Data Layer Tracking

Khi nào dùng: Site của bạn push e-commerce data vào GTM’s data layer (phổ biến cho Shopify, WooCommerce, Magento)
1

Tạo Tag Mới

TagsNew → Name: “Li2 - Track Sale - Data Layer”
2

Cấu Hình Tag Type

Chọn Custom HTML và paste script bên dưới
3

Set Up Trigger

TriggeringNew Trigger:
  • Trigger Type: Custom Event
  • Event Name: purchase (hoặc e-commerce event name của bạn)
Script:
<script>
(function() {
  // Đọc từ GTM data layer (được push bởi e-commerce platform của bạn)
  var ecommerce = {{Ecommerce}};
  var transaction = (ecommerce && ecommerce.purchase) ? ecommerce.purchase : {};
  var actionField = transaction.actionField || {};

  var customerId = actionField.customer_id || "";
  var revenue = actionField.revenue || 0;
  var amount = Math.round(parseFloat(revenue) * 100);
  var invoiceId = actionField.id || "";
  var currencyRaw = actionField.currency || "usd";
  var currency = currencyRaw.toLowerCase();

  // Lấy click ID từ GTM variable
  var clickId = {{Li2 Click ID}} || "";

  // Chỉ track nếu có đủ required fields
  if (customerId && amount > 0 && clickId) {
    li2Analytics.trackSale({
      eventName: "Purchase",
      customerExternalId: customerId,
      amount: amount,
      invoiceId: invoiceId || undefined,
      currency: currency,
      paymentProcessor: "stripe",
      clickId: clickId
    });
  }
})();
</script>
Cấu Trúc Data Layer: Script trên giả định format Enhanced Ecommerce chuẩn. Nếu platform của bạn dùng structure khác, điều chỉnh object paths cho phù hợp. Check GTM Preview mode để inspect actual data layer structure.

Testing GTM Setup

Bước 1: Dùng GTM Preview Mode

1

Enable Preview Mode

Trong GTM workspace, click nút Preview (góc trên bên phải)
2

Connect Đến Website

Nhập website URL và click Connect. Cửa sổ mới mở với GTM debugger overlay
3

Test SDK Loader Tag

  1. Navigate qua site của bạn
  2. Trong GTM debugger, verify “Li2 Analytics - SDK Loader” fires trên tất cả pages
  3. Check phần Tags Fired
4

Test Lead Tracking

  1. Navigate đến form page hoặc thank you page
  2. Verify lead tracking tag fires
  3. Check tag configuration và variable values trong debugger
5

Test Sale Tracking

  1. Navigate đến order confirmation page
  2. Verify sale tracking tag fires
  3. Confirm amount, customerId, và clickId được capture đúng

Bước 2: Browser Console Verification

Mở browser console (F12) và verify: 1. SDK Đã Load:
li2Analytics
// Nên return: {trackLead: ƒ, trackSale: ƒ, ...}
2. Click ID Cookie:
document.cookie.split(';').find(c => c.includes('li_cid'))
// Nên return: " li_cid=cm3w..."
3. Manual Event Test:
li2Analytics.trackLead({
  eventName: "Test Lead",
  customerExternalId: "[email protected]",
  customerEmail: "[email protected]"
})
// Check Network tab cho POST request đến Li2 API

Bước 3: Network Tab Verification

  1. Mở DevToolsNetwork tab
  2. Filter bằng “track” hoặc API domain của bạn
  3. Trigger lead/sale events
  4. Tìm POST requests đến Li2 API endpoints
  5. Check request payload để đảm bảo data gửi đúng
Debug Mode: Thêm ?li2_debug=true vào URL để enable verbose logging trong console. Điều này show chính xác data mà Li2 SDK đang capture và send.

Troubleshooting

Nguyên nhân phổ biến:
  1. Trigger conditions không match: Check page URL hoặc form selector match chính xác
  2. Tag sequence issue: Đảm bảo SDK loader tag fire trước tracking tags
  3. Variable không return value: Test {{Li2 Click ID}} trong GTM Variables section
Fix:
  • Dùng GTM debugger để xem tại sao trigger không match
  • Test trigger conditions manually (check actual URL, form ID trong inspector)
  • Verify variable được config đúng (cookie name = li_cid)
Nguyên nhân: SDK loader tag chưa fire hoặc script failed to loadFix:
  1. Check GTM Preview - “Li2 Analytics - SDK Loader” có fire không?
  2. Check Network tab - script có load từ unpkg.com không?
  3. Ad blocker block? Disable và test lại
  4. Check browser console cho JavaScript errors
  5. Verify publishable key đúng (không typos)
Nguyên nhân: DOM selectors không match form structure thực tếFix:
  1. Inspect form HTML để tìm actual field IDs/classes
  2. Update selectors trong script:
    // ❌ Nếu này không match HTML của bạn
    var emailField = document.getElementById("email");
    var email = emailField ? emailField.value : "";
    
    // ✅ Đổi để match form của bạn
    var emailField = document.querySelector("input[name='user_email']");
    var email = emailField ? emailField.value : "";
    
  3. Test trong browser console trước để verify selector hoạt động
Nguyên nhân: Amount không convert sang centsFix:
// ❌ SAI: Gửi dollars
amount: 49.99  // → Treated as 49 cents = $0.49

// ✅ ĐÚNG: Nhân 100 để convert sang cents
amount: Math.round(49.99 * 100)  // → 4999 cents = $49.99
Nguyên nhân: Tag fire nhiều lần do trigger setup saiFix:
  1. Check GTM debugger - tag fire bao nhiêu lần?
  2. Review trigger conditions - có quá rộng không?
  3. Với form submissions: Enable “Wait for Tags” và set max wait time
  4. Với page views: Đảm bảo URL condition đủ specific
  5. Dùng parameter invoiceId để prevent duplicate sales (Li2 deduplicate trong 7 ngày)
Nguyên nhân: Domain hiện tại không có trong allowed hostnames listFix:
  1. Vào Li2 Settings → Analytics → Security
  2. Thêm domain vào Allowed Hostnames:
    • Exact match: example.com
    • Tất cả subdomains: *.example.com
    • Development: localhost hoặc 127.0.0.1
  3. Save và test lại

Best Practices

1. Dùng GTM Folders: Organize tất cả Li2 tags trong folder tên “Li2 Analytics” để dễ quản lý2. Name tags nhất quán: Dùng prefix “Li2 -” cho tất cả tags để dễ tìm3. Document setup của bạn: Thêm notes trong tag descriptions giải thích mỗi tag làm gì4. Test trong Preview trước khi publish: Luôn dùng GTM Preview mode để verify tags hoạt động trước khi publish production5. Dùng version control: GTM auto-saves versions - thêm descriptive version names khi publish6. Set up error alerts: Configure GTM để gửi notifications khi tags fail to fire

Sắp Ra Mắt

Shopify Integration

Native Shopify app cho automatic conversion tracking

WooCommerce Plugin

WordPress plugin cho WooCommerce stores

Zapier Integration

Connect Li2 với 5,000+ apps qua Zapier

Segment Integration

Gửi conversion events qua Segment CDP
Muốn early access? Liên hệ chúng tôi tại [email protected] để tham gia beta program cho upcoming integrations.

Next Steps