Отслеживание скопированного текста в Google Analytics 4
В предыдущем материале вы узнали, как отслеживать события, связанные с копированием какого-либо текста на вашем сайте с помощью Google Tag Manager, и передавать содержимое этого текста в Universal Analytics. В этой статье сделаем то же самое, только для Google Analytics 4.
Обновление: я выпустил электронное руководство по Google Analytics 4. Бесплатно скачать его можно в формате .PDF по ссылке.
Если у вас на странице есть информация, которую пользователи могут скопировать, будь то это текст, промокод, контактные данные или др., то вы можете зафиксировать такое событие и передать его в GA4 вместе с содержимым. Причем не важно как это будет сделано - через вызов контекстного меню (правая кнопка мыши):
Копирование текста через контекстное меню
Через выделение нужного текста и сочетание клавиш Ctrl + C или благодаря дополнительному функционалу сайта, например, иконке буфера обмена:
Копирование текста через иконку буфера обмена
Самый простой и эффективный способ - использовать нижеприведенный код, создав в Google Tag Manager тег типа Пользовательский HTML тег и добавив в него следующий фрагмент:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<script> function getSelectionText() { var text = ''; if (window.getSelection) { text = window.getSelection().toString(); } else if (document.selection && document.selection.type != 'Control') { text = document.selection.createRange().text; } return text; } document.addEventListener('copy', function(e){ dataLayer.push({ 'event': 'textCopied', 'clipboardText': getSelectionText(), 'clipboardLength': getSelectionText().length }); }); </script> |
В GTM это будет выглядеть так:
Код addEventListener в Google Tag Manager
Триггер активации – Все страницы (All Pages).
Функция getSelectionText возвращает текст, который находится в буфере обмена. Метод addEventListener регистрирует обработчик события. В нашем случае – это copy. Событие срабатывает тогда, когда выделение было скопировано в буфер обмена. Затем полученную информацию мы помещаем в уровень данных (dataLayer), в которой есть 3 пары ключ:значение. Это:
- event – название пользовательского события (textCopied, но может быть другим);
- clipboardText – фактическое содержимое скопированного текста;
- clipboardLength – длина скопированного текста (количество символов);
Теперь мы можем использовать все это при активации триггера и отправке значений в Google Analytics 4. Создайте пользовательскую переменную типа Переменная уровня данных со значением clipboardText для извлечения значения скопированного текста:
Переменная уровня данных clipboardText
Для отслеживания количества символов создайте еще одну переменную со значением clipboardLength:
Переменная уровня данных clipboardLength
Я рекомендую создать обе, поскольку в Google Analytics 4 все обращения фиксируются как события, то информация о скопированном тексте будет отправляться в качестве параметра события, а на них действует ограничение по длине значения - 100 символов! Это важно помнить. Если скопированный текст будет больше этой длины, вся часть текста после 100 будет обрезана. Чуть ниже я продемонстрирую это. Создав переменную clipboardLength, вы сможете в отчетах Google Analytics 4 увидеть те тексты, которые имеют большую длину, чем разрешено, как раз по этому параметру события, и при необходимости отфильтровать их.
Добавьте в контейнер триггер специального события. Если на предыдущем шаге в теге вы не меняли его имя, то это textCopied:
Триггер специального события textCopied
Все, что осталось сделать, это создать тег отправки полученных данных в Google Analytics 4. Для этого используйте тег типа Google Аналитика: событие GA4:
Тег Google Analytics 4
Триггер активации - специальное событие textCopied, созданный на предыдущем шаге. В теге задайте произвольное название события (например, text_copy), а в качестве параметров события передайте два параметра, так же используя произвольные названия (например, user_text и text_length соответственно), присвоив им значения переменных уровня данных clipboardText и clipboardLength, которые вы создали ранее.
Сохранив все настройки, можно проверить корректность их работы с помощью режима отладки диспетчера тегов Google и инструмента DebugView в Google Analytics 4.
Например, на странице https://osipenkov.ru/contacts/ моего сайта размещены мои контактные данные. Скопировав никнейм Telegram, на шкале событий GTM отобразится событие textCopied и активированный тег GA4, а открыв API Call, вы увидите, как на уровень данных передалась информация о содержимом буфера обмена (@YakovOsipenkov) и длине самого текста (15).
Пример скопированного текста @YakovOsipenkov
Перейдя в сам тег, вы увидите значения, которые были переданы в параметрах события в Google Analytics 4:
Тег GA4 с нужными значениями параметров событий
В DebugView через некоторое время вы увидите ваше событие, кликнув на которое справа откроется список передаваемых параметров, а вместе с ним и наши пользовательские:
Событие text_copy с параметрами в GA4
Примерно через 24 часа статистика по отслеживаемым параметрам будет доступна для событий в стандартных отчетах Google Analytics 4. Данные будут отображаться в отчете Взаимодействие - События, а также в разделе Конфигурация - События.
Для того, чтобы в ваших отчетах фиксировались дополнительные данные по событиям, вам необходимо вручную создавать специальные определения в интерфейсе GA4. Сделать это можно в разделе Конфигурация - Специальные определения (Custom definitions), создав два специальных параметра с областью действия События:
Специальные параметры user_text и text_length
Название параметра может быть произвольным, а вот Параметр события должен быть точно таким же, как и в теге GA4. В моем примере - это user_text и text_length соответственно. В дальнейшем вы их можете использовать в Исследованиях.
Рекомендую к прочтению:
Теперь давайте разберем пример, когда значение параметра события превышает 100 символов. То есть пользователь копирует много текста. На той же странице моего сайта https://osipenkov.ru/contacts/ есть текст, который имеет длину 210 символов. Скопировав его весь, на шкале событий вы увидите правильно сформированный уровень данных со всеми необходимыми параметрами:
Копирование большого текста
Однако в самом DebugView GA4 вы увидите 210 и урезанное значение скопированного текста до 100 символов согласно ограничениям на сбор данных GA4:
Урезанное значение скопированного текста согласно ограничениям на сбор данных о событиях (100 символов)
В таком виде оно и будет отображаться в отчетах Google Analytics. Например, в Исследовании:
Параметры события в Исследовании
Именно поэтому решение, описанное в данное статье, следует использовать для GA4 только в случае, когда длина скопированного текста не превышает 100 символов. Например, копирование промокода, контактных данных, реферальной ссылки и других важных фрагментов вашего сайта, а не сам текст статьи и его абзацы.
Примечание: ограничение на количество символов в GA4 одинаково для языков с однобайтовыми (например, английский) и двухбайтовыми (например, японский) символами.
