Блог

Настройка отслеживания комментариев в Disqus с помощью Google Analytics и Google Tag Manager.

DEV
606
dolgova@itforce.com.ua
Настройка отслеживания комментариев в Disqus с помощью Google Analytics и Google Tag Manager.
07 августа 2017
Мария Долгова

Данная статья является вольным переводом на русский язык публикации в блоге Analytics Mania. С оригиналом можно ознакомиться по ссылке - здесь.

Disqus - это сервис, который позволяет настроить обсуждения и комментарии на сайте без использования CMS. На сегодняшний день он является лидером рынка: его используют порядка 750 тысяч сайтов и блогов. Он отлично подходит для того, чтоб пользователи могли публиковать комментарии со своей учетной записи в соц. сетях. В этой статье мы рассмотрим, как настроить отслеживание комментариев Disqus в Google Analytics с помощью Диспетчера тегов Google.

Готовый для импорта контейнер можно скачать - здесь. После импорта необходимо только прописать ваш идентификатор отслеживания Universal Analytics в теге GA Event - DISQUS Comment.

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

Шаг первый. Настройка прослушки DISQUS для GTM.

Создаем собственный пользовательский тег HTML, для того чтобы при публикации комментария через DISQUS на сайте запускалось событие DataLayer, которое в дальнейшем будет использовано как триггер.

Пользовательские настройки HTML тега:

  • Имя тега - cHTML - DISQUS Listener
  • Тип - Специальные/Пользовательский HTML
  • Вставляем указанный фрагмент кода:
<script>
 var disqus_config = function () {
 this.page.url = '{{Page URL}}'; // Replace PAGE_URL with your page's canonical URL variable
 this.callbacks.onNewComment = [function() {
 window.dataLayer = window.dataLayer || [];
 window.dataLayer.push({
 'event': 'disqus_comment'
 });
 }];
 };
</script>

Триггер Pageview - DOM Ready в данном теге настраиваем таким образом:

  • Имя триггера - Pageview - DOM Ready
  • Тип - Просмотр страницы - Модель DOM готова
  • Триггер активируется на следующих страницах - Все события "Модель DOM готова"​

Сохраняем тег. Публикуем изменения.

пользовательский тег cHTML - DISQUS Listener

 

Следующим этапом будет проверка запуска события DataLayer прослушки DISQUS. Для этого включаем режим предварительного просмотра в GTM.

предварительный просмотр события GTM

 

Переходим на сайт и в консоли отладки внизу браузера проверим срабатывание события. Публикуем в качестве теста DISQUS комментарий на сайте, при этом должно появиться событие и его можно использовать как триггер для передачи события в Google Analytics:

проверка срабатывания события disqus_comment

 

Шаг второй. Настройка триггера и включение переменной.

Прежде чем переходить к настройке триггера, нужно проверить включена ли встроенная переменная Page URL.

Для этого открываем Переменные -> Встроенные переменные -> Настроить.

проверка переменной Page URL

Затем создаем триггер:

  • Имя триггера - Custom - disqus_comment
  • Тип - пользовательское событие
  • Название события - disqus_comment
  • Триггер срабатывает - Все специальные события

Сохраняем.

настройка триггера Custom - disqus_comment

 

Шаг третий. Настройка тега передачи события в GA.

Переходим во вкладку Теги и создаем новый тег:

  • Тип тега - Universal Analytics
  • Тип отслеживания - событие
  • В поле «Категория события» прописываем - Disqus comment
  • В поле «Действие» указываем переменную - {{Page URL}}
  • Ставим галочку напротив «Включить переопределение настроек в этом теге» и в раскрывшемся поле «Идентификатор отслеживания» копируем/вставляем значение нашего идентификатора Google Analytics UA-********-*. Для упрощения работы с тегами в дальнейшем рекомендуется создать собственную переменную {{UA}} типа «константа», где можно указать идентификатор Google Analytics один раз и при создании тега не копировать номер счетчика вручную, а просто выбрать из списка переменных сохраненную константу {{UA}}:

настройка тега GA Event - Disqus comment

  • В разделе триггер выбираем созданный ранее триггер Custom - disqus_comment. Сохраняем тег. Публикуем изменения в рабочей области.

Проверяем передачу события в Google Analytics.

Оставляем на сайте еще один тестовый комментарий DISQUS и заходим в Google Analytics в отчет «В режиме реального времени». Во вкладке «События» - должно отобразиться событие Disqus comment.

проверка успешной отправки события в google analytics

Поделитесь с друзьями:
Подписаться на обновленияПолучайте еще больше полезных статей
X