Отслеживание исходящих ссылок с помощью Google Analytics

Website development
Google Analytics предоставляет широкие возможности по сбору и анализу статистики сайта, но, способ отслеживания исходящих ссылок, предлагаемый в справочном центре…

<a href="http://www.primer.ru" onClick="javascript:urchinTracker('/outgoing/primer_ru');">

…мягко говоря, не очень удобен.

Поскольку сама возможность очень интересная, я решил все-таки использовать ее и при этом обойтись без прикрепления onclick к каждой внешней ссылке.


План


Можно, конечно, пройти по всем ссылкам на странице с помощью JavaScript и прикрепить к каждой соответствующий обработчик onclick, но это некрасиво, не оптимально и не работает, если посетитель кликнет не на саму ссылку на вложенную в нее картинку. К этому случаю очень подходит техника делегации событий, достаточно будет одного обработчика onclick прикрепленного к элементу document.

Скрипт


Для упрощения скрипта использовалась библиотека JQuery, но поклонники других фреймворков смогут без труда его адаптировать.
<code>//функция определяющая является ли ссылка внешней
function isLinkExternal(link)
{
    var r = new RegExp('^https?://(?:www.)?'
        + location.host.replace(/^www./, ''));
    return !r.test(link);
}

$(document).ready(function () {
    
    $(document).bind('click', function(e) {
        //получаем элемент с которым произошло событие
        var target = (window.event) ? e.srcElement : e.target; 
        
        //клик мог быть и на вложенном в ссылку элементе
        //нужно подняться до самой ссылки
        while (target)
        {
            if (target.href) break;
            target = target.parentNode;
        }

        if (!target || !isLinkExternal(target.href))
            return true;

        //отслеживаем ссылки в виде /outgoing/http/habrahabr.ru
        var link = target.href;
        link = '/outgoing/' + link.replace(/:\/\//, '/');
        urchinTracker(link);
    });
    
    //в качестве бонуса отслеживаем клики на ссылках RSS
    //хотя полной статистики по подписавшимся нам это не даст
    $('#feed-link').bind('click',
        function() { urchinTracker('/feed/'); });
    $('#fullfeed-link').bind('click',
        function() { urchinTracker('/fullfeed/'); });
    $('#commentsfeed-link').bind('click',
        function() { urchinTracker('/commentsfeed/'); });
});</code>


Скрипт разработан совместными усилиями на форуме htmlbook.ru

Другие приемы использования Google Analytics, можно найти на сайте Design For Masters в статье Продвинутое использование Google Analytics
Tags:Google AnalyticsGoogleстатистикаJavaScript
Hubs: Website development
+24
3.4k 44
Comments 16

Popular right now

Node.js: серверный JavaScript
March 1, 202127,000 ₽Loftschool
JavaScript: новый уровень
February 10, 2021786 $WAYUP
Основы HTML и CSS
February 1, 2021FreeНетология

Top of the last 24 hours