Цели Яндекс Метрики: копирование почты и глубина скроллинга

У нас в блоге была уже ознакомительная статья на тему что такое цели Яндекс Метрики, как подключить счетчик и как настроить популярные цели. Тем, кто не читал и не сталкивался с системой аналитики Яндекс Метрика рекомендуем прочесть сперва ее. Статья доступна по этой ссылке.

А сегодня мы хотим рассказать, как настроить более сложные цели Яндекс Метрики с использованием java-script событий.

Цели Яндекс Метрики через скрипты

Стандартные цели Яндекс Метрики, как правило, не позволяют настроить цели на все события, которые нам бы хотелось отслеживать, но с помощью скриптов мы можем настроить достижение целей на практически любое действие посетителя на нашем сайте.

Сейчас, с внедрением в контекстную рекламу Яндекс Директ алгоритмов, основанных на искусственном интеллекте, обучить кампанию на достижение классических целей (звонок, заполненная форма, оплата покупки и прочее), становится все труднее. Если за неделю кампания не набрала хотя бы 10 конверсий, то обучение останавливается и нужно менять настройки и перезапускать кампании. Порой, чтобы нормально обучить алгоритмы уходит несколько недель. Поэтому многие используют так называемые микроконверсии- небольшие и простые цели, которые проходит посетитель сайта прежде чем оставить заявку или совершить покупку.

Цели Яндекс Метрики, которые полезно добавить на свой сайт.

Для использования в качестве микроконверсий полезно учитывать такие действия пользователя на сайте как:

• • время проведенное на сайте с учетом активности
  • глубина просмотра страниц, посещение нескольких страниц сайта
  • использование калькуляторов, конструкторов и прочих интерактивных элементов сайта
  • копирование почты, телефона или текста

Сегодня мы покажем, как добавить самые популярные цели для отслеживания системой статистики Яндекс Метрика. 

В наших примерах мы будем использовать Google Tag Manager (GTM)- удобный инструмент, который позволит настроить цели без ковыряния в коде вашего сайта.

Цель Яндекс Метрики: копирование почты

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

По нашей статистике, многие клиенты предпочитают не заполнять стандартные формы, а просто скопировать email и написать запрос напрямую. Но стандартные цели позволяют только отслеживать переход на почту, если посетитель нажал на кнопку «Написать письмо» и в событиях появилась ссылка вида mailto:вашапочта@вашдомен, а если просто копировать email, то такие события не видны в отчетах. Конечно, можно решить эту задачу и с помощью сервиса коллтрекинга, который предоставляет подменные адреса для почты, но не все используют трекинг. 

Для начала, мы создадим событие в Яндекс Метрике через скрипт, укажем название «Копирование Email» и присвоим цели свой идентификатор: email_copy

Далее нужно вставить вот такой скрипт в ваш сайт.

<script>
var c = document.getElementsByTagName("a");
for(var i = 0; i < c.length; i++) {
    if((typeof(c[i]) !== undefined) && (c[i].href.indexOf('mailto') !== -1)) {
        c[i].addEventListener('copy', function(evt) {
            dataLayer.push({
            'event': 'copyText', 
            'copy-class' : evt.target.className
            });
        });
        c[i].addEventListener('contextmenu', function(evt) {
            dataLayer.push({
            'event': 'rightClick', 
            'copy-class' : evt.target.className
            });
        });
    }
}
</script>

Для этого мы создаем новый тег в GTM:

Для удобства, новый тег мы назовем так же, как и цель- «Копирование Email», конфигурация тега — «Пользовательский HTML», в качестве триггера — Все страницы (All pages). В пользовательский код HTML мы и поместим скрипт, который мы привели выше.

Теперь создадим два дополнительных триггера для отслеживания событий копирования и выделения текста. Для этого, в рабочей области GTM переходим в раздел «Триггеры» и создаем новый с типом «Пользовательское событие» и прописываем событие — rightClick, в специальные события добавляем настройку Event-содержит- rightClick.

Если все сделано верно, то должно получиться, как на скриншоте.

Аналогично создадим еще один триггер, но для события copyText

Теперь нам нужно настроить передачу данных о событии в Яндекс Метрику. Для этого создаем еще один тег в GTM: конфигурация тега — «Пользовательский HTML», в качестве триггеров добавим 2 триггера, которые мы создали на прошлом шаге. В HTML код нам нужно поместить следующий код:

<script type="text/javascript">
 yaCounterXXXXXXXXX.reachGoal('copy_email');
</script>
XXXXXX-номер счетчика Яндекс Метрика

Если все сделано правильно, то в Яндекс Метрике начнет отображаться новая цель-копирование email

Цель Яндекс Метрики: глубина скролла страницы

Еще одна полезная цель, которая позволяет оценить вовлеченность и активность посетителя на вашем сайте. 

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

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

Итак, начнем настройку. Для начала нужно перейти в GTM и активировать новую переменную, если вы этого не сделали ранее. 

Найти все переменные можно в разделе «Переменные», а дальше в открывшемся списке поставить галочку около переменной  Scroll Depth Threshold

Теперь нужно настроить триггер для этого события. Для этого создаем новый триггер, а в разделе «Взаимодействие пользователей» выбираем «Глубина прокрутки». Затем выделяем галочкой что мы хотим отслеживать именно вертикальную прокрутку и задаем глубину в процентах.

Я указал сразу два значения: 75 и 100 процентов.

Почти готово, осталось только передать данные в Метрику. Для этого создаем новый тег с типом «Пользовательский HTML», в качестве триггера добавляем ранее созданный триггер. А в HTML помещаем следующий код:

<script>yaCounterXXXXXXX.reachGoal('{{Scroll Depth Threshold}}');</script>

Не забудьте так же поменять XXXXX на свой номер счетчика.

Теперь нам остается только создать цели в самой метрике. Для этого мы создаем цель, которая называется «Прокрутка 75%» и в качестве скрипта указываем число 75.

Аналогично создаем цель для 100% прокрутки.

Важно учитывать, что если у вас одноэкранный сайт, то цель будет срабатывать после загрузки страницы. Так же учитывайте при анализе данных, что триггер активирует тег только один раз для каждого порогового значения на странице.

О настройке остальных целей мы расскажем в наших следующих статьях.