Как отслеживать YouTube видео на сайте с помощью Диспетчера тегов?

Приветствую, друзья! На связи Евгений Тридчиков и в этом видео мы разберем, как отслеживать YouTube-видео на сайте с помощью Google Tag Manager. Лень читать? Смотрите видео в конце статьи!

Перемещаемся в аккаунт Диспетчера тегов и первым делом активируем триггер типа “Видео YouTube”. С помощью него мы можем регистрировать такие события, как начало просмотра видео, завершение и промежуточные действия, как то перемотка, пауза, а также фиксировать пороговые значения просмотра.

Настройка триггеров взаимодействия с видео

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

Это означает, что если условно вы настроете порог на 25%, посмотрите видео до этого значения, а затем отмотаете назад и снова пройдете порог в 25%, то триггер не сработает дважды.

Фиксируем начало и завершение просмотра видео

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

У первого триггера ставим галочки “Начало” и “Завершение”, также я активирую поддержку JavaScript API для видео. Ссылку на справочную информацию по данной функции я приложу под видео, но честно говоря в моем случае это не имеет значения.

Условие активации – все видео. Сохраняем, даем понятное название.

Отлично, копируем только что созданный триггер, меняем название, снимаем галочки статусов, активируем “Ход просмотра” и задаем пороги в процентах. Например, 25, 50, 90. Пороговые значения для 0 и 100 описываются первым триггером. Сохраняем, даем понятное название.

Процентные пороги просмотра видео

Теперь если вы активируете “Режим отладчика”, то увидите, что дебаггер Диспетчера тегов фиксирует взаимодействия со встроенными видео на сайте и передает соответствующие ключи.

Активируем макросы взаимодействия с видео

Перемещаемся к встроенным переменным, кнопка “Настроить” и активируем необходимые. В данном видео мне пригодятся лишь некоторые, а именно:

  • Video Provider – которая передает название поставщика видео, то есть youtube;
  • Video Status – которая принимает значения start и complete при начале и завершении просмотра видео соответственно,
  • Video Percent – которая принимает пороговые значения, выраженные в процентах (в нашем случае это 25, 50 и 90).

Я также мог воспользоваться переменной Video Title, чтобы передавать названия просмотренных видео. Но дело в том, что заголовки видео у меня содержат эмоджи, я подумал что это может быть не очень хорошо, и поэтому решил передавать URL статей. Так в отчетах тоже все будет понятно.

Справочную информацию по всем встроенным переменным, которые описывают взаимодействия с видео, я привожу в описании.

Тег для Аналитики

Переходим к созданию тегов. Давайте пробрасывать соответствующие события в Google Analytics и Яндекс Метрику. Начнем с большого брата. Тип тега Universal Analytics, тип отслеживания Событие.

В категорию кладем макрос Video Provider, который будет передавать значение youtube. В действие поместим макрос Video Status, который будет передавать значения start и complete. В ярлык положим макрос Page Path, путь страницы, который передает URL статьи без корня.

Пример тега для передачи событий в Аналитику

В качестве триггера указываем Видео YouTube, который фиксирует статусы просмотра видео. Отлично. Таким образом, мы отправляем в Google Analytics два события: когда пользователь запускает видео и когда пользователь смотрит видео до конца.

Скопируем данный тег, поменяем название, а также в качестве действия укажем переменную Video Percent: это макрос, который передает значения 25, 50 и 90. В качестве триггера, как вы уже догадались, указываем Видео YouTube, который фиксирует пороговые значения просмотра.

Таким образом, с помощью второго тега мы отправляем в Google Analytics 3 события: когда пользователь просматривает 25, 50 и 90 процентов видео.

Тег для Метрики

Хорошо, займемся Яндекс Метрикой. Создаем новый тег, тип тега Пользовательский HTML, вставляем знакомую конструкцию для отправки события, в качестве идентификатора указываем макрос Video Status. Триггер – видео YouTube, который фиксирует статусы начала и завершения просмотра видео. Сохраняем, даем понятное название. Супер.

Копируем тег, меняем название, в качестве идентификатора события указываем макрос Video Percent. Триггер, как вы уже догадались – видео YouTube, который фиксирует пороговые значения в процентах.

Отправляем события в Метрику

Поздравляю, друзья! Только что мы настроили передачу событий в Universal Analytics и Яндекс Метрику для определенных взаимодействий с видео на сайте.

Если хотите, то в Метрике можно настроить составную цель. Здесь шагами будут достижения целей типа Javascript-событие. В соответствующих полях указываем идентификаторы событий для начала видео, процентных порогов и завершения просмотра видео.

В Google Analytics статистика по просмотрам видео будет доступна в отчетах по событиям. Если хотите настроить составную цель, то пробрасывайте не события, а виртуальные страницы.

Виртуальные страницы для Аналитики

Для этого в настройках тега укажите тип отслеживания – просмотр страницы. Включите переопределение настроек, разверните дополнительные настройки, “Поля, которые необходимо задать”. В названии поля укажите page, а в качестве значения адрес виртуальной страницы. Например /youtube/{{Video Status}}.

Пример виртуальной страницы в Аналитику

Аналогично для второго тега, который передает события для пороговых значений просмотра видео. Только замените в адресе страницы макрос {{Video Status}} на {{Video Percent}}. При необходимости вы можете передавать название виртуальной страницы с помощью поля title. Теперь в Google Analytics вы можете настроить составную цель, используя эти виртуальные страницы.

Сложно? Смотрите пошаговое видео!

Если вам понравилось видео, поделитесь с коллегами и смотрите дальше! С вами был Евгений Тридчиков и я желаю вам великолепного дня!

Ссылочная масса

comments powered by HyperComments
(3 оценок, среднее: 5,00 из 5)
Загрузка ...
Блог Евгения Тридчикова