Отслеживание видео YouTube для Яндекс.Метрики

29 декабря, 2022

В предыдущих материалах мы с вами познакомились со способами отслеживания видео YouTube, размещенных на вашем сайте, с помощью стандартного триггера Google Tag Manager и соответствующих тегов для Google Analytics. В этой статье я расскажу, как можно настроить отслеживание видео YouTube, используя те же переменные и триггеры, но для Яндекс.Метрики.

Если вам интересно, как настраивается отслеживание видео YouTube для Google Analytics, рекомендую прочитать эти материалы:

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

Как вы уже знаете, стандартный триггер Видео на YouTube регистрирует следующие типы событий:

Настройки триггера "Видео на YouTube"

  • Начало (Start) – пользователь начинает просмотр видео;
  • Завершение (Complete) – пользователь достигает конца видео;
  • Приостановка (пауза), перемотка, буферизация (Pause, Seeking, Buffering) – пользователь останавливает, перематывает видео или когда происходит буферизация;
  • Ход просмотра (Progress) – пользователь проходит процентный (заданный в поле) или временный порог (время измеряется в секундах). Целые положительные числа указываются через запятую, как на скриншоте выше.

Если вы планируете отслеживать все эти события, то я рекомендую на каждое из них создать свою собственную цель в Яндекс.Метрике.

Предварительные настройки

Но перед тем, как вы это сделаете, произведите предварительные настройки в своем контейнере Google Tag Manager. Если вы никогда не настраивали отслеживание видео на YouTube, то порядок действий следующий:

  1. активируйте встроенные переменные;
  2. настройте триггер;
  3. создайте тег для Яндекс.Метрики.
Активация встроенных переменных

Для активации встроенных переменных необходимо перейти в раздел Переменные и активировать встроенные переменные типа Видео:

Встроенные переменные типа "Видео"

Переменные:

  1. Video Provider — название платформы видео (YouTube);
  2. Video Status — статус видео в момент регистрации события. Может быть: Start, Complete, Pause, Seek, Buffering, Progress;
  3. Video URL — URL-адрес, ссылку на видео YouTube (https://www.youtube.com/watch?v=...);
  4. Video Title — название видео;
  5. Video Duration — общая продолжительность видео (в секундах);
  6. Video Current Time — текущее время видео (в секундах), в которое произошло событие;
  7. Video Percent — значение воспроизведенного видео (в процентах) на момент, когда сработало событие;
  8. Video Visible — значение видимости видео в окне браузера. Если видео отображается в области просмотра, результатом будет значение true, если же в другой области (например, в нижней части страницы, на фоновой вкладке) – false.
Настройка триггера

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

Триггер "Видео на YouTube"

Задайте в нем нужные настройки регистрации событий, а также установите флажок рядом с Включить поддержку JavaScript API для всех видео YouTube, чтобы активировать YouTube iFrame Player API. В результате ко всем URL видеопроигрывателя YouTube будет добавлен параметр enablejsapi = 1 для управления проигрывателем через iframe или JavaScript.

Можно выбрать один из 3 способов активации триггера по событию - Container Load (gtm.js) - после загрузки страницы, DOM Ready (gtm.dom) - после обработки модели DOM и Window Load (gtm.load) - после загрузки контента страницы. Если не уверены в настройке, оставьте вариант по умолчанию.

Настройка триггера

Ход просмотра относится ко всей длине видео. Поэтому когда вы настроите триггер на процентные пороги (например, на 25%, 50%, 75%), или на временные пороги (например, на 15, 30, 60, 120 секунд), он сработает и в случае перемотки пользователем на соответствующую метку. Другими словами, условия непрерывного просмотра видео здесь нет.

Примечание: не на всех сайтах стандартный триггер Google Tag Manager работает "из коробки". Все зависит от вашего сайта и способа установки видео внутри проигрывателя. Бывают ситуации, когда видео YouTube запускается автоматически на странице, из всплывающего окна, при нажатии на кнопку или какого-то специального плагина. Из-за этого GTM не всегда может отслеживать такие реализации. В этом материале я целенаправленно опускаю наличие таких проблем (и способы их решения) и сосредотачиваюсь на настройке отслеживания для Яндекс.Метрики, предполагая, что у вас срабатывает триггер Видео на YouTube как надо.

Создание целей в Яндекс.Метрике

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

Создать цель в Яндекс.Метрике

Выберите цель типа JavaScript-событие. В поле Идентификатор цели добавьте значение, соответствующее одному из событий. Например, если вы отслеживаете событие начала просмотра видео, то таким идентификатором может быть start:

Событие начала просмотра видео YouTube

Для завершения просмотра видео идентификатор цели можно задать complete, для паузы - pause, для перемотка - seek, для буферизации - buffering, для хода прогресса - progress:

Цели на все события видео YouTube

Переменная таблицы поиска

Передавать в Яндекс.Метрику дополнительные данные по событиям мы будем с помощью параметров визитов. А для того, чтобы они отображались в отчетах в понятном для нас виде, необходимо в Google Tag Manager создать пользовательскую переменную типа Таблица поиска. Принцип работы переменной схож с конструкциями if..else и switch-case. Ее конфигурация будет выглядеть так:

Таблица поиска

Как работает таблица поиска?

  1. задается входная переменная. В этом примере - {{Video Status}};
  2. далее идет проверка по таблице поиска и входным данным;
  3. если переменная {{Video Status}} принимает одно из значений из таблицы (start, pause, progress и т.д.), то входная переменная {{Video Status}} примет значение из поля Результат. В этих полях мы прописываем названия по своему усмотрению;
  4. если значение переменной {{Video Status}} не найдено среди таблицы поиска, то будет использовано значение по умолчанию (если указано в настройках). В этом примере - {{Video Status}}.

Сохраните переменную, задав ей название (например: Video Actions). В дальнейшем она понадобится вам для параметров визита.

Тег Яндекс.Метрики

Перейдите в раздел Теги и создайте тег типа Пользовательский HTML. Вставьте нижеприведенный код между тегами <script></script>

, где вместо XXXXXXXX укажите идентификатор вашего счетчика Яндекс.Метрики.

Данный код работает следующим образом - в переменной visitParams мы объявляем иерархическую структуру параметров визитов вида youtube -> название зарегистрированного события в удобочитаемом виде (используется переменная таблица поиска) -> параметры события (Название видео, URL видео, Текущее время видео в секундах, Общая продолжительность видео, Сколько % просмотрел видео пользователь и Видимость видео), значения которых извлекаются с помощью встроенных переменных Видео.

Затем прописывается стандартная строка с JavaScript-событием ym(XXXXXXXX, 'reachGoal', '{{Video Status}}', visitParams), где в качестве четвертого аргумента как раз и идет наш объект visitParams с параметрами визита. А с помощью встроенной переменной {{Video Status}} мы создаем универсальную конструкцию для отслеживания конверсий в Яндекс.Метрике, поскольку вместо нее будет подставляться одно из объявленных ранее значений события - начало просмотра видео (start), завершение просмотра видео (complete), пауза (pause), перемотка (seek), буферизация (buffering) и ход прогресса (progress). Как только пользователь совершит какое-либо событие из вашего списка, сработает триггер, который активирует тег и передаст JavaScript-событие (цель) в Яндекс.Метрику со всеми перечисленными параметрами события.

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

В Google Tag Manager это будет выглядеть так:

Отслеживание видео YouTube для Яндекс.Метрики

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

Проверить корректность передачи данных и срабатывания целей Яндекс.Метрики с помощью режима предварительного просмотра и специального расширения для Google Chrome, которое называется Яндекс.Метрика Инспектор. Перейдите на любую страницу вашего сайта, где установлен проигрыватель YouTube. Начните взаимодействовать с видео. Вы увидите, как на шкале событий GTM появятся события YouTube Video и на них будет срабатывать ваш тег Яндекс.Метрики.

Режим отладки

Параллельно режиму отладки откройте консоль вашего браузера с расширением Яндекс.Метрика Инспектор. Оно должно зафиксировать достижение целей с параметром визита. Раскрыв одну из них, вы увидите условие срабатывания и сам параметр визита:

Достижение цели с параметрами визита

В нем фиксируются все параметры, которые вы объявили в пользовательском HTML теге в виде иерархической структуры, где первым уровнем вложенности является youtube, вторым - название события на русском языке (в зависимости от его срабатывания), а третьим - сами параметры видео (переменные YouTube). Все эти значения будут отображаться в отчете Содержание - Параметры визитов:

Содержание - Параметры визитов

Открыв отчет, вы увидите параметр визита со значением youtube:

Параметры визита youtube

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

Отслеживаемые события

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

Параметры события

В дальнейшем вы можете использовать параметры визита при создании собственных сегментов Яндекс.Метрики.

Помимо параметров визита, которые доступны в отчете Параметры визитов, вы еще настроили отслеживание стандартных конверсий. Через некоторое время данные по ним отобразятся в Яндекс.Метрике в отчете Конверсии:

Отслеживаемые конверсии в Яндекс.Метрике

Резюме

Отслеживание видео на YouTube для Яндекс.Метрики с помощью Google Tag Manager не так сильно отличается от настройки Universal Analytics и Google Analytics 4. И там, и там используются встроенные переменные и стандартный триггер. Отличие только в итоговом теге для систем аналитики - для GA3/GA4 используются готовые шаблоны, а для Яндекс.Метрики, как правило, Пользовательский HTML тег, и параметры визита. Сложность заключается только в правильном составлении окончательной конструкции объекта с учетом четвертого аргумента visitParams. Но она достаточно простая, универсальная для всех проектов и не должна вас пугать. За счет этого значительно упрощается отслеживание не только параметров визита, но и всех целей, которые вы создали в Яндекс.Метрике. Для этого достаточно одного триггера и одного тега GTM!

Получайте бесплатные уроки и фишки

По контекстной, таргетированной рекламе и аналитике