Настройка User ID для сайтов на WordPress
Отслеживание User ID для сайтов на WordPress с помощью бесплатного плагина и Google Tag Manager.
В предыдущем материале мы с вами разобрали настройку расширенной электронной торговли с помощью плагина Google Tag Manager для WordPress. Теперь затронем тему отслеживания авторизованных пользователей на сайте с помощью того же самого решения.
Рекомендую к прочтению другие статьи на эту тему:
- Две модели аналитики
- User ID в Google Analytics
- Отслеживание User ID для интернет-магазина на 1С-Битрикс
- Настройка User ID с помощью Google Tag Manager
- Настройка User ID для Google Analytics 4 с помощью GTM
В Google Analytics и Яндекс.Метрике эта функция называется User ID. Она позволяет связывать разные сеансы и действия пользователей на различных устройствах и отслеживать выполнение конверсий клиентов, которые заходили на сайт с нескольких девайсов с целью оценки вклада каждого типа устройств и последующей оптимизации рекламных бюджетов. Такое отслеживание еще называют кросс-девайсным (cross device).
В результате внедрения на сайте User ID в отчетах Google Analytics вы сможете видеть такую картину:
Пользователь на сайте зарегистрирован под идентификатором 137. Он выполнил 44 сеанса с десктопа и совершил 4 транзакции на общую сумму 595 940 руб. Все они привязаны к одному Client ID, в то время как другой уникальный идентификатор пользователя зафиксировал 1 сеанс с мобильного устройства. Если бы мы не имели специального параметра и настройки User ID, то связать Client ID = 1288110046.1582107977 и Client ID = 1911903864.1585317566 с одним пользователем не представлялось бы возможным. С точки зрения систем веб-аналитики это были бы два разных пользователя. Но поскольку для данного проекта настроено отслеживание User ID, то в отчетах мы можем идентифицировать пользователя с разных браузеров и устройств как одного и того же человека. Это дает возможность не только расширить отчеты Google Analytics новыми данными, но и позволяет узнать, сколько различных типов устройств применяют пользователи при взаимодействии с вашим сайтом и в каком % соотношении.
В основе реализации User ID лежит внутренняя база пользователей вашего сайта и их идентификаторов. Как вы уже знаете из предыдущих материалов, по вашему техническому заданию (ТЗ) разработчик на сайте сначала должен сформировать уровень данных (dataLayer). Затем вы настраиваете все необходимые переменные, триггеры и теги в Google Tag Manager (если выполняете настройку через него!), а на завершающем шаге проверяете корректность работы и передачу данных в инструменты веб-аналитики.
В зависимости от технологий и CMS-системы вашего сайта, настройка User ID может отличаться. В этом примере мы будем разбирать отслеживание User ID для WordPress с помощью бесплатного плагина Google Tag Manager для WordPress. Прелесть его заключается в том, что разработчик данного плагина уже за нас позаботился о формировании всех необходимых данных для dataLayer. Нам же остается только активировать нужные настройки в интерфейсе WordPress и извлечь значение User ID из переменной уровня данных. Давайте с вами проделаем это.
Первым делом необходимо установить плагин. Сделать это можно с помощью двух способов:
- добавить новый плагин через раздел Плагины;
- скачать плагин на официальной странице, распаковать его на компьютере и загрузить с помощью FTP-клиента в папку вашего сайта wp-content/plugins. Затем в интерфейсе WordPress в разделе Плагины / Установленные включить Google Tag Manager для WordPress.
На следующем шаге перейдите в раздел Настройки - Google Tag Manager. На вкладке General добавьте идентификатор вашего контейнера GTM:
В настройке Container code placement выберите способ размещения кода и сохраните изменения. Если у вас код Google Tag Manager установлен напрямую в <head>, то вы можете выбрать Off (only add data layer to the page source) и тогда повторного срабатывания загрузки контейнера не будет. Если вы хотите разместить код GTM через плагин и делаете это впервые, то можете выбрать пункт Codeless injection.
Теперь перейдите на вкладку Basic data - Visitors:
На этой странице отображены настройки всех возможных параметров, которые вы можете передавать на уровень данных:
- Logged in status - определяет, является ли текущий посетитель авторизованным пользователем;
- Logged in user role - роль авторизованного пользователя (список ролей из WordPress);
- Logged in user ID - идентификатор залогиненного пользователя;
- Logged in user name - имя авторизованного пользователя;
- Logged in user email - e-mail авторизованного пользователя;
- Logged in user creation date - дата регистрации авторизованного пользователя на сайте;
- Visitor IP - IP-адрес посетителя.
С помощью данного плагина вы можете извлекать значение IP-адрес посетителя вашего сайта. Однако согласно обработке персональных данных, установленных Генеральным регламентом ЕС о защите персональных данных (или GDPR — General Data Protection Regulation), в Google Analytics или любую другую систему веб-аналитики запрещается передавать полный IP-адрес пользователя без его согласия. Но вы можете использовать IP-адрес для фильтрации внутреннего трафика сотрудников вашей компании.
Если вы проводите настройку для своего сайта впервые, я рекомендую поставить все галочки. Тогда вы сможете максимально подробно увидеть как будет отображаться уровень данных в режиме предварительного просмотра Google Tag Manager. Сохраните настройки.
Зайдите в диспетчер тегов Google и активируйте режим отладки. Не забудьте на сайте зайти под своей учетной записью (авторизоваться). Как только вы это сделаете, на шкале событий появится новое сообщение Message, которое срабатывает после загрузки контейнера Container Loaded, но до DOM Ready и Window Loaded. Кликнув по нему, отобразится сформированный уровень данных со значениями всех активированных в настройках плагина параметров. Для моего сайта osipenkov.ru он выглядит так:
- visitorLoginState - переменная, которая определяет, является ли текущий посетитель авторизованным пользователем;
- visitorType - роль авторизованного пользователя;
- visitorEmail - e-mail авторизованного пользователя;
- visitorRegistrationDate - дата регистрации авторизованного пользователя на сайте;
- visitorUsername - имя авторизованного пользователя;
- visitorId - идентификатор залогиненного пользователя (то, что нам нужно!);
- visitorIP - IP-адрес.
Поскольку я являюсь администратором своего сайта, то мой User ID = 1 (ID - 1 в базе данных). Остается небольшой вопрос, связанный с датой регистрации авторизованного пользователя. У меня отобразилось значение 1462629275. Это временная метка в формате Unix (количество секунд, прошедших с первого января 1970-ого года). Мы можем перевести ее в удобочитаемый вид, просто перейдя на сайт конвертера Epoch Unix Time Stamp Converter и в поле Enter a Timestamp вставив дату регистрации. Нажмите Enter:
Дата регистрации на сайте стала в привычном для человека формате - 7 мая 2016 г. Именно тогда я впервые начал заниматься своим блогом. Если вы хотите передавать правильную дату в Google Analytics, создайте в GTM две пользовательских переменных:
1. переменную уровня данных с visitorRegistrationDate:
2. переменную типа Собственный код JavaScript со следующим кодом:
1 2 3 |
function() { return new Date({{visitorRegistrationDate}}*1000).toString(); } |
, где {{visitorRegistrationDate}} - название первой переменной уровня данных.
Из всего представленного списка нас больше всех интересует переменная уровня данных visitorId, которая хранит идентификатор авторизованного пользователя. Для извлечения значения в Google Tag Manager создайте переменную типа Переменная уровня данных с именем visitorId.
Сохраните переменную.
Все последующие настройки аналогичны тем, что описаны в этом материале для любого проекта. За исключением того, что в другом примере данные формировались до загрузки контейнера GTM и в теге Universal Analytics можно было использовать триггер Проcмотр страницы (All Pages), в этом дела обстоят чуть иначе.
Поскольку плагин Google Tag Manager для WordPress передает данные после загрузки Container Loaded (в этот момент User ID еще не определен), мы можем использовать только триггеры DOM Ready и Window Loaded:
Необходимо передать User ID при каждом обращении Google Analytics. Чтобы не обновлять каждый тег вручную, откройте переменную типа Настройки Google Analytics и в разделе Дополнительные настройки – Поля, которые необходимо задайте userId и укажите в Название поля – userId, а в Значение добавьте переменную уровню данных, которую создали на предыдущем шаге:
Так нужно делать для того, чтобы видеть все обращения (события, просмотры страниц и т.д.) в отдельном представлении Google Analytics (User-ID). Поэтому мы настраиваем идентификатор пользователя Google Analytics на уровне переменной Настройки Google Analytics, а не только в теге просмотра страницы Google Analytics. В этом случае было бы достаточно этого:
Разумеется, вам необходимо для этого создать в Universal Analytics отдельное представление. Для этого перейдите в Universal Analytics и в колонке Ресурс выберите Отслеживание – User-ID:
Примите правила в отношении User-ID, переключите ползунок в позицию «Вкл.» и нажмите Далее:
На следующем шаге будет приведен пример классического кода для Universal Analytics (библиотеки analytics.js) и глобального тега Global Site Tag (библиотеки gtag.js):
Эти конструкции нас не интересуют, поскольку мы используем настройку через Google Tag Manager, а не добавляем код напрямую. На последнем шаге создайте новое представление User ID, введя его название, указав часовой пояс и включив опцию Показать отчеты User-ID. Нажмите кнопку Создать:
В этом представлении будут отображаться данные о хитах и сеансах пользователей, которые были авторизованы на вашем сайте и имели User ID. Чтобы убедиться в том, что представление User-ID было создано правильно, вы можете перейти в его настройки и посмотреть, какой статус отчетов там стоит:
Если Включено, то это представление User-ID. Если Выключено, то это обычное представление Universal Analytics.
Чтобы закончить с настройкой Universal Analytics, перейдите на уровне ресурса в раздел Пользовательские определения - Специальные параметры и создайте новый параметр. Введите название пользовательского параметра, выберите Область действия – Пользователь, оставьте галочку Активная и нажмите Создать:
Запомните индекс пользовательского параметра (в моем примере – 8):
Вернитесь в GTM, в тег Universal Analytics / переменную Настройки Google Analytics и в разделе Дополнительные настройки – Специальные параметры задайте Индекс и укажите Значение параметра:
Сохраните изменения. На этом настройка отслеживания User ID для сайтов на WordPress завершена. Проверить корректность передачи данных можно любым известным вам способом, например, с помощью режима предварительного просмотра диспетчера тегов:
Как видно из деталей тега Universal Analytics, значение User ID корректно определяется передается в поля, которые необходимо задать, и в созданный специальный параметр.
Для отправки идентификатора пользователя в Яндекс.Метрику используйте метод userParams, который позволяет передавать произвольные параметры посетителей сайта, и параметр UserID. Пример конструкции выглядит так:
1 |
ym(XXXXXX, 'userParams', {UserID: {{User ID пользователя}}}); |
, где XXXXXX – номер счетчика Яндекс.Метрики, а User ID пользователями – переменная уровня данных, созданная на предыдущем шаге.
В Google Tag Manager:
Данные по User ID в Яндекс.Метрике доступны в отчете Параметры посетителей и в карточке конкретного пользователя раздела Посетители.
Таким образом, вы можете использовать несколько представлений (одно – User-ID, а другое – обычное) для отслеживания действий пользователей с привязкой к их идентификатору. А с созданным специальным параметром появляется возможность сопоставить обращения, покупки человека с его реальными данными, которые собираются в вашей CRM-системе.