Sử dụng jQuery để lắng nghe và vượt qua theo dõi sự kiện Google Analytics cho bất kỳ lần nhấp nào
Tôi ngạc nhiên rằng nhiều tích hợp và hệ thống hơn không tự động bao gồm Theo dõi sự kiện Google Analytics trong nền tảng của họ. Phần lớn thời gian của tôi làm việc trên các trang web của khách hàng là phát triển tính năng theo dõi Sự kiện để cung cấp cho khách hàng thông tin họ cần về những hành vi của người dùng đang hoạt động hoặc không hoạt động trên trang web.
Gần đây nhất, tôi đã viết về cách theo dõi lần nhấp vào mailto, điện thoại nhấp chuộtvà Đệ trình biểu mẫu yếu tố. Tôi sẽ tiếp tục chia sẻ các giải pháp mà tôi đang viết với hy vọng rằng nó sẽ giúp bạn phân tích hiệu suất trang web hoặc ứng dụng web của mình tốt hơn.
This example provides a very simple means of incorporating Google Analytics Event Tracking into any anchor tag by adding a data element that includes the Google Analytics Event Category, Google Analytics Event Action, and Google Analytics Event Label. Here’s an example of a link that incorporates the data element, called sự kiện:
<a href="#" data-gaevent="Category,Action,Label">Click Here</a>
Điều kiện tiên quyết cho trang web của bạn là bao gồm jQuery trong đó… mà tập lệnh này được cung cấp. Sau khi trang của bạn được tải, tập lệnh này sẽ thêm một trình xử lý vào trang của bạn cho bất kỳ ai nhấp vào một phần tử có sự kiện dữ liệu… sau đó nó nắm bắt và phân tích cú pháp danh mục, hành động và nhãn mà bạn chỉ định trong trường.
<script>
$(document).ready(function() {
$(document).on('click', '[data-gaevent]', function(e) {
var $link = $(this);
var csvEventData = $link.data('gaevent');
var eventParams = csvEventData.split(',');
if (!eventParams) { return; }
eventCategory = eventParams[0]
eventAction = eventParams[1]
eventLabel = eventParams[2]
gtag('event',eventAction,{'event_category': eventCategory,'event_label': eventLabel})
//alert("The Google Analytics Event passed is Action: " + eventAction + ", Category: " + eventCategory + ", Label: " + eventLabel);
});
});
</script>
Lưu ý: Tôi đã bao gồm một cảnh báo (đã nhận xét) để bạn có thể kiểm tra những gì đã thực sự vượt qua.
Nếu bạn đang chạy jQuery trên WordPress, bạn sẽ muốn sửa đổi mã một chút vì WordPress không đánh giá cao phím tắt $:
<script>
jQuery(document).ready(function() {
jQuery(document).on('click', '[data-gaevent]', function(e) {
var $link = jQuery(this);
var csvEventData = $link.data('gaevent');
var eventParams = csvEventData.split(',');
if (!eventParams) { return; }
eventCategory = eventParams[0]
eventAction = eventParams[1]
eventLabel = eventParams[2]
gtag('event',eventAction,{'event_category': eventCategory,'event_label': eventLabel})
//alert("The Google Analytics Event passed is Action: " + eventAction + ", Category: " + eventCategory + ", Label: " + eventLabel);
});
});
</script>
Đây không phải là tập lệnh mạnh mẽ nhất và bạn có thể cần phải thực hiện thêm một số thao tác dọn dẹp, nhưng nó sẽ giúp bạn bắt đầu!