Отслеживаем ссылки в GA с jQuery
Google Analytics
- Содержание

По умолчанию, Google Analitycs не показывает, на какую страницу пользователь ушел с сайта или какой файл скачал. Конечно, о скачанных файлах можно узнать из серверной статистики, но это не так удобно.
Google Analitycs предлагает добавить ссылке событие onClick следующим образом:
<a href="http://www.example.com" onClick="javascript: pageTracker._trackPageview('/G1/example.com');">
Это старый и неудобный способ. С развитием JavaScript фреймворков гораздо удобнее добавить обработчик события глобально на все ссылки страницы. Используем jQuery:
$(document).ready(function(){
$("a[href^='http://']").click(function(){
pageTracker._trackEvent("links", "external", $(this).attr("href"), 0);
});
});
Здесь используется событие pageTracker._trackEvent() с параметрами:
- Category – группа объектов, которую вы хотите отслеживать.
- Action – тип взаимодействия с объектом, однозначно связан с объектом.
- Label – дополнительный параметр события.
- Value – числовое значение, связанное с событием.
Последние два параметра являются необязательными.
Приведенный выше пример простой, но накладывает ограничения:
- Внутренние ссылки тоже могут начинаться с http://.
- Невозможно определить, переходим на файл или страницу.
Эти недостатки исправлены в следующем плагине LinkTracker:
(function($){
$(document).ready(function(){
jQuery('a').linkTracker({
inDomain : true,
fileTypes : [ 'pdf', 'zip', 'tgz', 'gz', 'gzip', 'rar']
});
});
})(jQuery);
Опции
- inDomain определяет, отслеживать ли ссылки внутри поддоменов. Установив в true, для example.com и subdomain1.example.com ссылки на subdomain2.example.com не будут считаться внешними.
- fileTypes - список расширений файлов
- event - событие, к которому привязывается обработчик (click, mousedown, mouseup)
Исходный код
$.fn.linkTracker = function(opts) {
var defaults = {
inDomain : true,
event : 'mouseup',
fileTypes : [ 'pdf', 'zip', 'rar', 'tgz', 'gz', 'gzip', 'jpg', 'png', 'svg', 'gif', 'doc', 'eps', 'xls', 'ppt', 'xls', 'txt', 'vsd', 'js', 'css', 'exe', 'wma', 'mov', 'avi', 'wmv', 'mp3']
};
var options = $.extend(defaults, opts);
return this.each(function() {
var track = function(){
var $link = $(this),
category = $link.data('ga_category'),
action = $link.data('ga_action');
if (!category || !action) return;
if (typeof(pageTracker) == 'object') pageTracker._trackEvent(category, action, $link.attr('href'));
else if(typeof(_gaq) == 'object') _gaq.push(['_trackEvent', category, action, $link.attr('href')])
else throw('Google Analytics tracking object not found'); // if you need to throw errors;
}
$(this).each(function(){
var $a = $(this),
href = $a.attr('href');
// if no href or it starts with #
if (!href || /^#/.test(href)) return;
// if it is mailto link
if (/^mailto:/.test(href)) {
$a.data('ga_category', 'links');
$a.data('ga_action', 'mailto');
}
// otherwise
else {
var wHost = options.inDomain ? location.host.match(/\w+\.\w+$/) : location.host,
file_type = $.inArray(href.substring(href.lastIndexOf('.')+1).toLowerCase(), options.fileTypes);
// if is not downloadable file
if (file_type == -1){
var aHost = this.hostname;
// if is relative url
if (!aHost || aHost == '..') return;
// if is internal absolute url
if (options.inDomain){
if(aHost.indexOf(wHost) != -1) return;
}
else {
if(aHost == wHost) return;
}
$a.data('ga_category', 'links');
$a.data('ga_action', 'outgoing');
}
// if is file
else {
$a.data('ga_category', 'downloads');
$a.data('ga_action', options.fileTypes[file_type]);
}
}
/* $a.html($a.html() + ' (+trackevent)'); */ // for debugging..
$a.bind(options.event, track);
/* $a.trigger(options.event); */ // for debugging..
});
});
};
Статистика

В результате после обновления статистики в разделе Содержание -> Отслеживание событий -> Обзор вы увидите необходимую информацию. В скрипте я использовал следующие пары Category и Action:
| Category | Action | |
| Почтовые адреса | links | mailto |
| Внешние ссылки | outgoing | |
| Файлы | downloads | Расширение загружаемого файла |
Label всегда ссылка, Value не используется.
Также можно отслеживать через trackPageview, в этом случае статистика будет смешана с просмотренными внутренними страницами сайта.
Понравилась статья? Подпишись на RSS.
Советую почитать:
Отслеживаем ссылки в GA с Mootools
Скрытые возможности jQuery (часть 2)
Скрытые возможности jQuery
Подключаем GAPI к CodeIgniter
Google Analytics на вашем сайте
Скрытые возможности jQuery (часть 2) Отслеживаем ссылки в GA с Mootools
Комментарии
Здесь пока никто не писал.