Hướng dẫn cài Event chuyển đổi MePuzz trong Google Tag Manager (GTM)


Trong hướng dẫn này, MePuzz hướng dẫn bạn cách cài đặt event chuyển đổi MePuzz qua Google Tag Manager. Bạn vui lòng xem hướng dẫn như sau"
Sau khi đăng nhập vào tagmanager.google.com, đầu tiên bạn phải check có mở Variables của click tracking lên chưa như hình bên dưới 

1. Cài đặt Trigger, cấu hình tài khoản Google Tag Manager

Vào Workspace > Variables > Configure > Tracking, chọn tất cả yếu tố trong mục CLick


Cấu hình Variables trong Google Tag ManagerCấu hình Variables trong Google Tag Manager

Sau chọn tất cả Varibales của Clicks, tiếp tục tạo một Trigger cho một Click Event.

Vào Workspace > Triggers > New


Thêm Triggers trong Google Tag Manager

Sau đó chọn target cho Event Trigger, ở đây sẽ track cái Button Call do đó sẽ chọn là Just Links (vì mình gắn URL là tel:09xxx rồi), còn track bằng All Element thì trigger bằng thành phần CSS, etc... 

Chọn Fires On là All Clicks có nghĩa là khi bạn click bất kỳ chổ nào trên website Trigger này cũng kích hoạt, để cho các bạn hình dung được Event Trigger nó hoạt động như thế nào.

Sau đó, mới áp Trigger cho một thành phần cụ thể trên website (ở đây là Call Button) và gắn 1 Tag cho trigger đó.

Cấu hình Trigger trong Google Manager

Bạn tạm chọn All Clicks, rồi Save vào để lưu lại

Sau khi tạo Click Event Trigger và cho trigger ở tất cả các click, mở Preview & Debug để xem trigger hoạt động như thế nào (bấm vào mũi tên chỉa xuống kế bên nút Publish).

Preview and Debug trong Google Tag Manager
Preview and Debug trong Google Tag Manager

 
GTM Preview Mode


Mở mới website của bạn ở tab khác, ở phía dưới trang web sẽ xuất hiện khung Preview & Debug, bạn cứ click bất kì vào chỗ nào của website, sẽ thấy xuất hiện thêm gtm.click, giờ thì click vào button bạn cần tracking
GTM Quick Preview

Bây giờ thì sẽ tìm các Element của Call Button, mục đích để sửa lại điều kiện trigger của Event Trigger lúc nãy tạo. Trigger chỉ được kích hoạt khi click đúng vào Call Button. Các bạn giữ Phím Ctrl trên PC (hoặc Command trên Mac) và click vào Call Button (để load trang một tab mới và page cũ vẫn được giữ nguyên) nếu không load ra trang mới thì không cần bấm Ctrl.

Bấm vào tab Variable để xem Call Button này có những variable đặc biệt nào. So sánh lên, so sánh xuống với những click event khác thì Call Button có 1 variable là Click URL = “Tel:19008666”. Vậy bạn lấy variable này làm điều kiện trigger cho Event Trigger hồi nãy tạo.

Vào lại Google Tag Manager > Triggers > Event Trigger hồi nãy tạo, đổi tên lại thành Call Button Click Event & sửa lại Fire On = Some Clicks và copy link "Tel:19008666", sau đó lưu lại


Cấu hình Trigger trong Google Manager
2. Gắn Trigger vào MePuzz Tracking Event
Bước 1: Cài đặt lại <Script> MePuzz mới
Để cài đặt event chuyển đổi MePuzz, bạn cần cài đặt lại <Script> MePuzz mới lên trên website, bạn cài như sau:
Bạn nhấp chuột vào menu “Cài đặt” copy đoạn mã <Script> mới cài lên Header của website

Trường hợp bạn đã cài mã <Script> cũ, bạn vui lòng xóa bỏ đoạn mã cũ và thay lại bằng mã <Script> mới.





Bạn cũng có thể cài <Script> MePuzz qua Google Tag Manager. Trường hợp, bạn đã cài trực tiếp trên Header của website, bạn vui lòng xóa đoạn <Script> MePuzz cũ đã cài và copy lại <Script> MePuzz mới lên Google Tag Manager.

Bước 2: Cài Event "Page View" (Event xem nội dung trên website)
- Bạn truy cập trang cài đặt, kéo chuột xuống dưới để xem chi tiết các Event chuyển đổi của MePuzz




- Bạn copy đoạn mã <script> mePuzz('track','pageview'); </script>. Để nhúng lên Google Tag Manager bạn cần copy nguyên cả đoạn <script>mePuzz('track','pageview' </script>

- Truy cập vào Google Tag Manager, tạo thẻ Tag mới>Chọn HTML tùy chỉnh>Copy <script>mePuzz('track','pageview' </script>>chọn trigger All Page>Lưu lại





Bước 3. Cài đặt Event chuyển đổi trên MePuzz
- Bạn truy cập trang cài đặt, kéo chuột xuống dưới để xem chi tiết các Event chuyển đổi của MePuzz




- Chọn Event tương ứng mà bạn muốn cài đặt
Ở bước này, chúng ta cùng tiếp tục cài event Gọi Hotline tổng đài mà chúng ta đã tạo Trigger ở phần 1
- Truy cập vào Google Tag Manager, tạo thẻ Tag mới>Chọn HTML tùy chỉnh>Copy <script>mePuzz('track','call_hotline'); </script> >chọn trigger Click tel mà bạn đã tạo ở phần 1>Lưu lại
- Lưu ý khi copy mã cài đặt event từ MePuzz, bạn cần thêm mã <script></script> ở trước và sau đoạn mã event chuyển đổi.




Sau đó "save" rồi "preview" xem tag có hoạt động hay không -> rồi "publish". Để kiểm tra event này đã được gắn thành công hay chưa các bạn có thể kiểm tra và truy cập vào tạo tin nhắn trên MePuzz>Tạo đối tượng>Thêm mới Event>Chọn Event xem hiển thị số liệu chưa.




Như vậy là MePuzz hướng dẫn xong cách cài đặt và thiết lập chi tiết cho Event "Gọi Hotline" qua Google Tag Manager, các event còn lại bạn làm tương tự.