60_sec_plug_activity_js

60_sec_plug_activity_js.js

/**
 * @name jQuery plugin Activity
 * @version 1.3a
 * @author vs.ustinov
 * @author an.nidziy
 * @author gr.tsvetkov
 * @license GNU Free Documentation License
 * @copyright 2013 ООО «АйТи-агентство»
 * @link http://www.it-agency.ru/process/60seconds
 * @uses jQuery 1.7+
 *
 * Параметры: options = default
 *
 * @param achieveTime = 60
 * Время (в секундах), при котором будет засчитано достижение (вызвана callBack-функция)
 *
 * @param loop = 0
 * При зачете достижения - не останавливаться, считать дальше
 *
 * @param eventList = 'blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error'
 * При зачете достижения - не останавливаться, считать дальше
 *
 * @param testPeriod = 10
 * Время (в секундах) - периодичность проверки событий на странице
 *
 * @param useMultiMode = 0
 * Использовать cookie, для продолжения работы при переходах на другие страницы сайта
 *
 * @param callBack = function (e) { console.log('Achieved!') }
 * CallBack-функция, которая будет отрабатывать по достижение времени achieveTime
 *
 * @param watchEvery = 1
 * Время (в секундах) - периодичность работы.
 *
 *
 * @todo $('selector').activity(options)
 * 
 * @example $('body').activity({'achieveTime':60,'testPeriod':10, useMultiMode: 1, callBack: function (e) { ga('send', 'event', 'Activity', '60_sec'); yaCounterXXXXXXXXX.reachGoal('60_sec'); }});
 * Пример использования. Засчитать достижение по истечении 60 секунд;
 * Проверять активность каждые 10 секунд; Достижение засчитывать по всему сайту;
 * При достижении отработает функция, которая выполнит:
 * ga('send', 'event', 'Activity', '60_sec'); для Universal Analytics
 * yaCounterXXXXXXXXX.reachGoal('60_sec'); для Яндекс.Метрика (где XXXXXXXXX = ваш счетчик)
 *
 */ 
(function( $ ){
    var timerHand = 0, data = {}, eventFlag = 0, methods = { // Системные переменные и методы
        init:function(settings) { //Функция инициализация
            return this.each(function() { //Инициализируем объекты
                data = jQuery.extend({ // Установка параметров
                    achieveTime: 60 // Время (в секундах), при котором будет засчитано достижение (вызвана callBack-функция)
                    ,loop:0 // При зачете достижения - не останавливаться, считать дальше
                    ,eventList:'touchmove blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error'
                    ,testPeriod: 10 // Время (в секундах) - периодичность проверки событий на странице
                    ,useMultiMode : 1 // Использовать cookie, для продолжения работы при переходах по страницам
                    ,callBack: function (e) { console.log('Achieved!') } // CallBack-функция, которая будет отрабатывать по достижение времени achieveTime
                    ,watchEvery: 1 // Время (в секундах) - периодичность работы.
                    ,counter : {'test':0, 'achiev':0} // Счетчики проверки активности и достижения (оставить по-умолчанию)
                }, settings);

                data.watchEvery *= 1000; //Счетчик наблюдения

                if(data.useMultiMode) {
                    methods.loadMultiData();//Если включен режим кросс-страничного наблюдения - загружаем данные
                }

                if(data.counter.achiev != -1) { //Если не выключено
                    $(this).bind(data.eventList, methods.eventTrigger); //Bind`дим события из eventList к указанному объекту
                    methods.process();  // Запускаем процесс проверки
                }
            })
        }, process:function() { // Функция, отрабатывающая каждые watchEvery*1000
            data.counter.test += 1; // Увеличиваем счетчик проверки активности

            if(data.counter.test == data.testPeriod) { // Если пришло время его просматривать
                if(eventFlag) { // Если во время проверки было зафиксировано событие
                    eventFlag = 0; // Сбрасываем флаг фиксации события
                    data.counter.achiev += data.testPeriod; // Увеличиваем счетчик достижения на количество времени проверки активности
                }
                data.counter.test = 0; // Сбрасываем счетчик проверки активности
            }

            timerHand = setTimeout(methods.process, data.watchEvery); // Установка таймера watchEvery
            if(data.counter.achiev >= data.achieveTime) { // Проверка, не сработало ли достижение
                if(!data.loop) clearTimeout(timerHand); // Если в цикле "достигаем" - убираем сбрасываем таймер проверки
                data.counter.achiev = data.loop ? 0 : -1; //Если в цикле - сбрасываем достижение, иначе выключаем
                data.callBack.call(this,data); // Вызываем callBack-функцию отработки достижения
            }
            if(data.useMultiMode) document.cookie = 'activity=' + data.counter.test+'|'+data.counter.achiev+'; path=/;'; // Если используем кросс-страничные достижения - сохраняем данные счетчиков в cookie

        }, eventTrigger:function() { // Триггер, отрабатывает при срабатывании событий из eventList
            eventFlag = 1; // Установка флага отработки события
        }, loadMultiData:function() { // Стандартный способ загрузки cookie
            var search = ' activity=';
            var cookie = ' ' + document.cookie;
            if (cookie.length > 0) {
                if (cookie.indexOf(search) != -1) {
                    offset = cookie.indexOf(search) + search.length;
                    var m = unescape(cookie.substring(offset, cookie.indexOf(";", offset) == -1 ? cookie.length : cookie.indexOf(";", offset))).split('|');
                    data.counter.test = parseInt(m[0]);
                    data.counter.achiev = parseInt(m[1]);
                    return;
                }
            }
            data.counter.test = data.counter.achiev = 0;
        }};

    $.fn.activity = function(method) { // Плагин Activity
        if(methods[method]) { // Если вызван метод
            return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
        } else {
            if(typeof method === "object" || !method) { // Происходит инициализация
                return methods.init.apply(this, arguments);
            } else {
                $.error("Method " + method + " does not exist on jQuery.activity"); //Выводим ошибку.
            }
        }
    }
})( jQuery );

readme.md

https://www.it-agency.ru/academy/tools/60seconds/

Во что считать конверсию, когда большинство покупок совершается звонком по телефону без переходов по сайту или взаимодействия с интерактивными элементами?

При ручном просмотре Вебвизора легко определить активных посетителей, которые реально изучают сайт и могут совершить звонок: они читают текст, двигают мышкой, скроллят страницу, иногда куда-нибудь кликают.

Мы создали скрипт, который отслеживает такую активность и фиксирует достижение цели «60 секунд активности на сайте».

Как это работает? Если в текущем 10-секундном интервале была какая-либо активность пользователя, к общему счетчику добавляется 10 секунд. В примере слева засчитанные 10-секундные интервалы закрашиваются красным. Цель считается достигнутой, когда наберется 60 секунд.

По умолчанию счётчик хранится в куках, поэтому активность суммируется при переходе между страницами или работе в параллельных табах.

В чём отличие от «времени на сайте» в Google.Analytics и Яндекс.Метрики? Во-первых, Аналитикс и Метрика не учитывают время, проведённое посетителем на последней странице. Если человек просмотрел всего одну страницу, то время, проведённое им на сайте, будет равно нулю.

Во-вторых, если человек открыл вкладку с нашим сайтом, а реально перешёл на неё только через 10 минут, сделал всего пару кликов и через 10 секунд закрыл, в обычной статистике зафиксируется время просмотра сайта 10 минут 10 секунд.

Справка Google.Analytics и Яндекс.Метрики

Можно ли доверять этой цели? Проверка: много ли посетителей совершают звонок, но не достигают цели «60 секунд»? Очень мало. Значит, мы можем отключать рекламу по запросам или кампаниям с низкой конверсией в «60 секунд» без риска снижения количества звонков.

Эту простую проверку не проходят многие привычные цели, например, «переход на страницу Контакты» или «отправка заявки с сайта».

Достаточно ли статистики? Конверсия в эту цель обычно находится в диапазоне 20–50 %. Такого количества достижений цели достаточно, чтобы собирать статистику по большинству запросов и пересчитывать по ним ставки пропорционально конверсии.

Тех же «заявок с сайта» обычно хватает всего на пару запросов. А остальным выставлять среднюю ставку?

Подключение скриптов Для того, чтобы использовать jQuery Activity, необходимо подключить javascript jQuery и сам плагин Activity:

<script src="jquery.js"></script> <script src="jquery.activity.min.js"></script>

Активация плагина Для того, чтобы запустить jQuery Activity, всего лишь необходимо указать элемент, к которому он будет применён, и настройки. Например:

$('body').activity({
	'achieveTime':60
	,'testPeriod':10
	,useMultiMode: 1
	,callBack: function (e) {
		ga('send', 'event', 'Activity', '60_sec');
		yaCounterXXXXXXXXX.reachGoal('60_sec');
	}
});

Заметьте, большинство настроек можно оставить по умолчанию. Это наиболее часто используемые настройки, кроме callback-функции — она для каждого своя.

Чтобы подключить скрипт через Google Tag Manager — используйте инструкцию.

Настройки Опций достаточно, чтобы обеспечить тонкую настройку JQuery Activity, однако большинство из них вы скорей всего оставите по умолчанию:

achieveTime по умолчанию равно 60. Время (в секундах), при котором будет засчитано достижение (вызвана callBack-функция); loop = 0. При зачёте достижения — не останавливаться, считать дальше; eventList по умолчанию равно «blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error»; testPeriod по умолчанию равно 10. Время (в секундах) — периодичность проверки событий на странице; useMultiMode по умолчанию равно 0. Использовать cookie, для продолжения работы при переходах на другие страницы сайта; callBack по умолчанию равно function (e) { console.log («Achieved!») } CallBack-функция, которая будет отрабатывать по достижению времени achieveTime; watchEvery по умолчанию равно 1. Время (в секундах) — периодичность работы.

add.js

$('body').activity({
	'achieveTime':60,
	'testPeriod':10,
	useMultiMode: 1,
	callBack: function (e) {
		dataLayer.push({
        	'event': 'GAevent',
        	'eventCategory': 'Activity',
        	'eventAction': '60_sec'
    	});
		yaCounter000000.reachGoal('60_sec');
	}
});

-------------------
  
  	$('body').activity({
		'achieveTime':60
		,'testPeriod':10
		,useMultiMode: 1
		,callBack: function (e) {
			ga('send', 'event', 'Activity', '60_sec');
			yaCounterXXXXXXXXX.reachGoal('60_sec');
		}
	});

minify.js

(function(e){var c=0,d={},a=0,b={init:function(f){return this.each(function(){d=jQuery.extend({achieveTime:60,loop:0,eventList:"touchmove blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error",testPeriod:10,useMultiMode:1,callBack:function(g){console.log("Achieved!")},watchEvery:1,counter:{test:0,achiev:0}},f);d.watchEvery*=1000;if(d.useMultiMode){b.loadMultiData()}if(d.counter.achiev!=-1){e(this).bind(d.eventList,b.eventTrigger);b.process()}})},process:function(){d.counter.test+=1;if(d.counter.test==d.testPeriod){if(a){a=0;d.counter.achiev+=d.testPeriod}d.counter.test=0}c=setTimeout(b.process,d.watchEvery);if(d.counter.achiev>=d.achieveTime){if(!d.loop){clearTimeout(c)}d.counter.achiev=d.loop?0:-1;d.callBack.call(this,d)}if(d.useMultiMode){document.cookie="activity="+d.counter.test+"|"+d.counter.achiev+"; path=/;"}},eventTrigger:function(){a=1},loadMultiData:function(){var h=" activity=";var g=" "+document.cookie;if(g.length>0){if(g.indexOf(h)!=-1){offset=g.indexOf(h)+h.length;var f=unescape(g.substring(offset,g.indexOf(";",offset)==-1?g.length:g.indexOf(";",offset))).split("|");d.counter.test=parseInt(f[0]);d.counter.achiev=parseInt(f[1]);return;}}d.counter.test=d.counter.achiev=0}};e.fn.activity=function(f){if(b[f]){return b[f].apply(this,Array.prototype.slice.call(arguments,1))}else{if(typeof f==="object"||!f){return b.init.apply(this,arguments)}else{e.error("Method "+f+" does not exist on jQuery.activity")}}}})(jQuery);