Отслеживание загрузки файлов в Яндекс.Метрике и Google Analytics
В отличие от Яндекс.Метрики, в Google Analytics нет встроенного функционала отслеживания скачиваемых с вашего сайта файлов. Для этого необходимо размечать каждую ссылку соответствующим кодом события. А можно воспользоваться GTM и за 3 действия настроить отслеживание всех загружаемых файлов.
Начнем с Метрики. Чтобы определить, сколько раз посетители попытались (!) скачать с вашего сайта файлы (музыку, видео, документы и т.д.), нет необходимости в какой-либо настройки. Яндекс сам собирает статистику по скачиванию файлов, по умолчанию поддерживая большое количество расширений.
Для этого можно воспользоваться стандартным отчетом Загрузки файлов.
Отчеты - Стандартные отчеты - Содержание - Загрузки файлов
В нем содержатся данные по взаимодействиям пользователей с файлами, которые размещены на вашем сайте. Это могут файлы разного размера и формата. Например:
- музыка (.mp3);
- документы (.docx, .rtf);
- отчетность, таблицы (.xlsx);
- видео (.mp4, .mpeg, .mov);
- установочные файлы (.exe);
- фотографии (.jpg, .jpeg, .png);
- книги (.djvu, .pdf);
- и т.д.
Если кто-то из посетителей захочет скачать что-то подобное на вашем сайте, Метрика зафиксирует это событие. По умолчанию поддерживается следующий список расширений: 3GP, 7Z, AAC, AC3, ACS, AI, AVI, APE, APK, ASF, BMP, BZ2, CAB, CDR, CRC32, CSS, CSV, CUE, DIVX, DMG, DJV, DJVU, DOC, DOCX, DOCM, DOCB, EMF, EPS, EXE, FLA, FLAC, FLV, GIF, GZ, TGZ, ISO, JPG, JPE, JPEG, JS, M3U, 3U8, M4A, M4V, MD5, MKV, MP3, MP4, MPG, MPEG, MOV, MSI, ODS, OGG, OGM, OGV, PDF, PHPS, PNG, PPT, PPTX, PPTM, PPTB, PSD, RAR, RSS, RTF, SEA, SIT, SFV, SHA1, SVG, SWF, TAR, TIF, TIFF, TORRENT, TS, TXT, VOB, WAV, WAVE, WEBM, WMA, WMV, WMF, XLS, XLSX, XLSM, XLSB,XPI,ZIP,GZIP
Вы можете передать в отчеты и другие расширения. Подробнее читайте в официальной справке Яндекса.
На скриншоте ниже представлен пример отчета Загрузки файлов по сайту моего курса по веб-аналитике, на котором размещена программа обучения в формате .pdf:
Отчет "Количество скачиваний" в Метрике
95 пользователей 117 раз переходило на ссылку с файлом analytics-pr.pdf . Данные в отчете сгруппированы по адресу, по которому расположен файл для скачивания.
В сводку Метрики также можно добавить виджет со статистикой по скачиваниям, выбрав при этом нужную сегментацию (например, по странице загрузки).
Настройка виджета в Метрике
Если Метрика умеет отслеживать загрузку файлов по умолчанию, то Google Analytics этим похвастаться не может. И чтобы зафиксировать взаимодействие пользователя с каким-либо файлом на вашем сайте, необходимо в код данного элемента добавить специальную конструкцию события.
Разберем тот же пример с analytics.osipenkov.ru. Нужно настроить отслеживание загрузки файла этого блока.
Отслеживание скачивания файла
Сделать это можно, как минимум, тремя способами:
- с помощью события соответствующей конструкции для библиотеки Google Analytics;
- с помощью Autotrack;
- с помощью Google Tag Manager.
Разберем каждый из них.
С помощью события соответствующей конструкции для библиотеки Google Analytics
Чтобы реализовать данный способ, вам необходимо:
- знать, какую библиотеку Analytics используете на сайте (gtag.js, analytics.js иди др.);
- удостовериться, что код Google Analytics установлен не через Google Tag Manager;
- иметь доступ к коду сайта;
- разместить код события соответствующей библиотеки на элементе, который отвечает за скачивание.
Полностью команда для analytics.js выглядит так:
|
1 |
ga('send', 'event', [eventCategory], [eventAction], [eventLabel], [eventValue], [fieldsObject]); |
Полностью команда для gtag.js имеет вид:
|
1 |
gtag('event', <action>, {'event_category': <category>, 'event_label': <label>, 'value': <value>}); |
Для библиотеки analytics.js для нашего примера можно использовать (событие onclick):
|
1 |
onclick="ga('send', 'event', 'DOWNLOAD', 'PDF');" |
Для библиотеки gtag.js так (событие onclick):
|
1 |
onclick = "gtag('event', 'PDF', {'event_category': 'DOWNLOAD'});" |
где:
- DOWNLOAD – категория события (Category);
- PDF – действие события (Action);
Категория и Действие по событию являются обязательными полями, а Ярлык и Ценность события необязательными.
Теперь необходимо добавить эту конструкцию на элемент отслеживания. У нас – это кнопка Скачать в формате .pdf (см. выше).
Открываем в любом текстовом редакторе страницу (либо на сервере, либо на локальном компьютере), на которой необходимо разместить код события, находим соответствующий элемент и внутри него добавляем. У меня это конструкция для библиотеки gtag.js:
Добавление кода события в элемент отслеживания (gtag.js)
Сохраняем изменения. Если страница была скачана с сервера, то загружаем и подтверждаем изменения. После этого переходим на наш сайт и кликаем по отслеживаемому элементу. В отчетах «В режиме реального времени», если все сделали верно, вы увидите настроенное событие:
В режиме реального времени
Аналогичным образом нужно проделать для каждого файла на сайте, который вы хотите отслеживать. Данные по событиям доступны в отчете Поведение – События – Лучшие события.
Отслеживание с помощью Autotrack
Autotrack (автоматическое отслеживание) - это библиотека JavaScript, которая создана на основе библиотеки analytics.js. Основная ее задача - облегчить разработчикам отслеживание действий пользователей, которые схожи на разных сайтах.
Вот некоторые преимущества автотрека:
- Отслеживание исходящих ссылок и форм. Раньше внедрение отслеживания исходящих ссылок и форм было затруднительным из-за того, что большинство браузеров прекращали поддержку JavaScript на текущей странице, когда начинала загружаться другая. Новый функционал решил эту проблему;
- Отслеживание изменений URL для одностраничных приложений. Нововведение автоматически отслеживает изменения URL, совершенные при помощи History API;
- Декларативное отслеживание событий;
- Отслеживание медиа-запросов.
Инструмент был анонсирован в начале 2016 года и сейчас доступен по ссылке: https://ga-dev-tools.appspot.com/autotrack/
Рекомендую к прочтению: Introducing Autotrack for analytics.js (на английском языке)
Например, вы можете использовать Autotrack для автоматического отслеживания кликов исходящих ссылок на вашем сайте. На этой странице визуально продемонстрировано то, как можно использовать автотрек для автоматического сбора данных с помощью этой библиотеки.
Клики на исходящие ссылки (Autotrack)
Если на вашем сайте загрузка файлов осуществляется с помощью клика по кнопке или ссылке, вы можете отследить его с помощью Autotrack. Так называемое декларативное отслеживание событий.
В коде отслеживания событий вы настраиваете специальные атрибуты data-event-category и data-event-action, присвоив им определенные значения.
Декларативное отслеживание событий
Чтобы это работало, вам нужно установить Autotrack. Вы также должны иметь контроль над метаданными в HTML вашего сайта.
Также с помощью автотрека можно отслеживать медиа-запросы: контрольные точки, точки останова (breakpoints), разрешение экрана (resolution), ориентацию экрана (orientation).
Отслеживание медиа-запросов с помощью автотрека
Чтобы настроить Autotrack на собственном сайте, необходимо ознакомиться с документацией (GitHub). Посмотреть исходный код можно здесь.
Примечание: Autotrack не работает с кодом gtag.js. Но его еще могут использовать на тех сайтах, на которых установлен Universal Analytics (библиотека analytics.js).
Autotrack, на первый взгляд, сложен в реализации. Однако не все аналитические решения просты. Вот почему я предлагаю еще одно решение.
Отслеживание с помощью Google Tag Manager
Если в Google Analytics вы хотите отслеживать много загружаемых файлов на своем сайте и не обладаете знаниями в разработке и разметке кода, то первые два способа могут показаться достаточно трудоемкими. Именно поэтому лучше настроить отслеживание загрузки файлов через Google Tag Manager.
Чтобы это сделать, необходимо:
- включить 1 встроенную переменную;
- настроить 1 триггер активации;
- создать 1 тег.
Переходим на вкладку Переменные и включаем встроенную переменную Click URL.
Включение встроенной переменной Click URL
Переходим на вкладку Триггер и выбираем Тип триггера – Клик – Только ссылки. Добавляем такие настройки:
- Условие активации триггера – Некоторые клики по ссылкам
- Активировать триггер по Click URL – соответствует регулярному выражению
Регулярное выражение \.(pdf|xlsx|xls|doc|txt|png|docx|ppt|pptx)$
Настройка триггера активации
В зависимости от типов файлов, которые размещены у вас на сайте, вы можете использовать разное количество расширений. Например, взять полный список всех расширений из Метрики и добавить его в триггер. В результате получите что-то подобное:
|
1 |
\.(3gp|7z|aac|ac3|acs|ai|avi|ape|apk|asf|bmp|bz2|cab|cdr|crc32|css|csv|cue|divx|dmg|djv|djvu|doc|docx|docm|docb|emf|eps|exe|fla|flac|flv|gif|gz|tgz|iso|jpg|jpe|jpeg|js|m3u|3u8|m4a|m4v|md5|mkv|mp3|mp4|mpg|mpeg|mov|msi|ods|ogg|ogm|ogv|pdf|phps|png|ppt|pptx|pptm|pptb|psd|rar|rss|rtf|sea|sit|sfv|sha1|svg|swf|tar|tif|tiff|torrent|ts|txt|vob|wav|wave|webm|wma|wmv|wmf|xls|xlsx|xlsm|xlsb,xpi,zip,gzip)$ |
Сохраняем триггер. Переходим на вкладку Теги и создаем тег типа Google Аналитика – Universal Analytics. Выбираем такие настройки:
- Тип отслеживания – Событие;
- Категория – произвольная (в моем примере Файл);
- Действие – произвольное (в моем примере Скачивание);
- Ярлык – {{Click URL}} (здесь будет отображаться путь к загружаемому файлу).
Настройка тега
Это один из способов передачи данных в Analytics в качестве события. Вы можете вместо Категории и Действия использовать другие значения. Например, переменную {{Page URL}}, которая будет передавать URL страницы с файлом. И т.д.
Сохраняем тег. Публикуем обновленный контейнер. Чтобы проверить корректность отслеживания, воспользуемся режимом предварительного просмотра GTM.
Кликнув по кнопке на сайте, сработал триггер активации, а с ним и тег.
Проверка отслеживания в режиме отладки GTM
Информация также передалась в Google Analytics. В режиме реального времени видим наши Категорию, Действие и Ярлык события, в котором передался путь до загружаемого файла:
В режиме реального времени
Данные по событиям будут также доступны в отчете Поведение – События – Лучшие события. Либо можно воспользоваться специальным отчетом с типом Простая таблица, добавив Категорию, Действие и Ярлык в качестве параметров.
Специальный отчет в Google Analytics
Понравилась статья? Поставьте оценку ?
