Отслеживание скопированного текста с помощью Яндекс Тег Менеджера

10 июля, 2025

Из этого руководства вы узнаете, как с помощью Яндекс Тег Менеджера можно отслеживать события, связанные с копированием какого-либо текста на вашем сайте, и передавать содержимое этого текста в инструменты веб-аналитики.

В моем блоге за последние полгода опубликовано более 20 материалов, посвященных настройке и отслеживанию событий с помощью Яндекс Тег Менеджера. В каждом из этих руководств подробно разбираются шаги настройки и методы проверки корректности внедрения. Ранее для отладки использовались шаблон тега Мини дебагер триггеров и переменных, а также режим _ym_debug=2 от Яндекс Метрики. С 20 ноября 2025 года в Яндекс Тег Менеджере появилась полноценная панель отладки, и часть описанных ранее подходов устарела. Поэтому, пожалуйста, пользуйтесь новой панелью отладки ЯТМ для проверки ваших настроек и обращайте внимание на актуальность информации в текущих статьях.

В моем блоге этой теме посвящено несколько публикаций. Я рекомендую прочитать их все, в том числе и статьи, посвященные Google Tag Manager:

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

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

  • номер телефона;
  • ваша электронная почта;
  • промокод на скидку;
  • абзац статьи;
  • цитата или какой-то другой полезный контент.

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

Копирование текста через контекстное меню

Через выделение нужного текста и сочетание клавиш Ctrl + C или благодаря дополнительному функционалу сайта, например, иконке буфера обмена:

Копирование текста через иконку буфера обмена

Все такие действия можно отследить и передать вместе с содержимым, например, в Яндекс Метрику. С появлением Яндекс Тег Менеджера у вас теперь есть выбор - использовать Google Tag Manager, или новый продукт от Яндекса.

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

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

Для этого нужно выполнить следующие настройки:

  • поставить галочку рядом с Пользовательский HTML;
  • создать триггер Инициализация для тега;
  • создать тег типа Пользовательский HTML и вставить в него специальный фрагмент кода;
  • создать триггер специального события;
  • создать пользовательские переменные;
  • создать тег отладки;
  • создать JS-событие в Яндекс Метрике для отслеживания скопированного текста;
  • создать тег события Яндекс Метрики.

Разберем каждый этап настройки подробнее.

Активация Тег Менеджер и пользовательского HTML

На первом шаге убедитесь, что вы активировали Тег Менеджер в настройках счетчика Метрики и поставили галочку рядом с Пользовательский HTML тег:

Активация Тег Менеджера и пользовательского HTML тега

Пользовательский HTML в Yandex Tag Manager (YTM) - это тип тега, который позволяет добавлять на сайт произвольный HTML-код, JavaScript или другие скрипты, которые не поддерживаются стандартными тегами и которых нет в каталоге шаблонов. Код будет выполняться при срабатывании триггера, в нем также можно использовать переменные для динамической подстановки нужных значений.

Создание триггера

Сохраните изменения. После этого перейдите в раздел Триггеры и добавьте триггер:

Создание триггера

В открывшемся окне выберите тип триггера Инициализация:

Триггер "Инициализация"

В качестве дополнительного условия активации вы можете задать конкретные страницы, на которых хотите отслеживать копирование текста. Например, не на всем сайте, а только на страницах блога или каталога. Для этого используйте условие Некоторые события - Page URL содержит или соответствует регулярному выражению, и далее перечислить сами страницы:

Дополнительное условие активации триггера

Если вы планируете отслеживать события скопированного текста на всех страницах сайтах, оставьте условия активации триггера Все события. Задайте название триггеру (например, Инициализация) и сохраните его.

Создание тега “Пользовательский HTML”

Перейдите в раздел Теги и нажмите на кнопку Добавить тег:

Создание тега

В открывшемся окне выберите шаблон тега - Пользовательский HTML:

Шаблон тега "Пользовательский HTML"

В поле HTML вставьте нижеприведенный фрагмент кода:

В Яндекс Тег Менеджере это будет выглядеть так:

Код в Яндекс Тег Менеджере

Что делает этот фрагмент кода? Функция getSelectionText возвращает текст, который находится в буфере обмена. Метод addEventListener регистрирует обработчик события. В нашем случае – это copy. Событие срабатывает тогда, когда выделение было скопировано в буфер обмена. Затем полученную информацию мы помещаем в уровень данных (dataLayer), в которой есть 3 пары ключ:значение. Это:

  • event – название пользовательского события (textCopied, но может быть другим);
  • clipboardText – фактическое содержимое скопированного текста;
  • clipboardLength – длина скопированного текста (количество символов);

В качестве триггера активации добавьте триггер Инициализация, созданные на предыдущем шаге. Задайте тегу название (например, HTML - Копирование текста) и сохраните его.

Тег HTML для копирования текста

Создание триггера специального события

Снова перейдите на вкладку Триггеры и создайте новый триггер. В открывшемся окне выберите тип триггера Специальное событие:

Тип триггера "Специальное событие"

Если вы ничего не меняли в предыдущем коде, то в поле Название события укажите textCopied:

Триггер специального события textCopied

Задайте название триггеру специального события (в моем примере textCopied) и сохраните его.

Создание пользовательских переменных

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

Создание переменной

В шаблоне переменной выберите Переменная уровня данных:

Переменная уровня данных

В поле Имя переменной уровня данных укажите clipboardText для извлечения значения скопированного текста:

Переменная уровня данных clipboardText

Для отслеживания количества символов создайте еще одну переменную уровня данных со значением clipboardLength:

Переменная уровня данных clipboardLength

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

Создание тега отладки

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

  • добавить еще один тег Мини дебагер триггеров и переменных;
  • использовать в режиме предварительного просмотра _ym_debug=2;

Создайте еще один тег в своем контейнере Яндекс Тег Менеджера. Задайте ему название (например: Тег отладки события копирования текста). Выберите тип тега Мини дебагер триггеров и переменных. Если его нет в списке, также добавьте его через Шаблоны из каталога.

Шаблон тега - Мини дебагер триггеров и переменных

Этот шаблон предназначен для временной отладки отработки триггеров и переменных в контейнере Яндекс Тег Менеджера. Он позволяет безопасно выводить значения в консоль браузера, не влияя на остальной код.

Примечание: подробнее о режиме предварительного просмотра в Яндекс Тег Менеджере читайте в этом руководстве.

У мини дебагера всего две настройки:

Настройки тега "Мини дебагер триггеров и переменных"

  1. установка триггера;
  2. поле для ввода какого-то значения вручную (например, текста об успешно отправленном событии) или указания переменной, чтобы в консоли выводилось ее значение, если оно изменяется во времени динамически.

Нам этот тег необходим для того, чтобы проверить корректность настройки созданного триггера textCopied для отслеживания скопированного текста (срабатывает ли он в принципе), а также двух переменных уровня данных, которые мы создали на предыдущем шаге.

Таким образом, настройки, которые я рекомендую задать для тега отладки, выглядят так:

Тег отладки события копирования текста

  • Триггер - специальное событие, которое вы создали на предыдущем шаге (textCopied);
  • Переменная - с помощью фигурных скобок {{ вы можете выбрать переменные уровня данных для отслеживания самого текста, который был скопирован пользователем, и его длины (DLV clipboardText и DLV clipboardLength).

Сохраните тег.

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

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

В правом верхнем углу Тег Менеджера нажмите на кнопку Предварительный просмотр и дождитесь компиляции ссылки.

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

Как только это произойдет, нажмите на кнопку Открыть предварительный просмотр:

Открыть предварительный просмотр

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

Примечание: подробнее о режиме предварительного просмотра в Яндекс Тег Менеджере читайте в этом руководстве.

В отдельном окне откроется ваш сайт, а в адресной строке браузера в URL-ссылке будет добавлен специальный параметр _ytm_preview. Поскольку мы с вами создали тег мини дебагера триггеров и переменных, который выводит результат в консоли, нам необходимо открыть ее. Для этого перейдите на вкладку Console:

Вкладка "Console" в браузере

Теперь выделите нужный текст на странице и скопируйте его. Если вы все настроили правильно, тогда в консоли разработчика появится уведомление о том, что это был за текст, и какова его длина. Именно эти значения извлекаются из переменных уровня данных:

Скопированный текст и его длина

В результате с помощью тега мини дебагера мы проверили и триггер специального события, который срабатывает на событие копирования (copy), и сами значения текста и его длины, которые извлекаются благодаря созданным переменным.

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

Создание JavaScript-события

Поскольку отслеживание скопированного текста - это событие, то вам необходимо зайти в свой счетчик Яндекс Метрики и создать цель типа JavaScript-событие. В качестве идентификатора цели вы можете задать произвольное название, например, copyText с условием совпадает:

JavaScript-событие для копирования текста

Запомните идентификатор цели. Сохраните цель.

Тег события Яндекс Метрики

Теперь вернитесь в Яндекс Тег Менеджер и создайте тег типа Яндекс Метрика (Передача информации о достижении цели):

Шаблон тега - Яндекс Метрика

В открывшемся окне задайте следующие настройки:

  • ID счетчика - вставьте идентификатор вашего счетчика Яндекс Метрики. Он отображается вверху страницы;
  • Идентификатор цели - задается на странице редактирования счетчика при создании или изменении цели типа JavaScript-событие. Как вы помните, в моем примере copyText);
  • Название - произвольное название тега, характеризующее его действие (например: Яндекс Метрика - Копирование текста);
  • Шаблон тега - Яндекс Метрика;

Поставьте галочку рядом с Добавить поле params и введите в него следующую конструкцию:

, где вместо {{ DLV clipboardText }} и {{ DLV clipboardLength }} необходимо подставить переменные уровня данных из вашего контейнера ЯТМ.

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

Итоговый тег события Яндекс Метрики будет выглядеть так:

Итоговый тег события Яндекс Метрики

Сохраните тег. Проверить корректность передачи данных и срабатывания целей Яндекс Метрики можно с помощью режима предварительного просмотра и конструкции _ym_debug=2. Добавьте ее после параметра _ytm_preview через &, чтобы получилось так:

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

Вы можете сделать это даже в режиме Инкогнито, после компиляции ссылки для режима предварительного просмотра ЯТМ. Внизу страницы появится значок  . Нажмите на него, чтобы открыть панель отладки. Перейдите на вкладку Events и выполните копирование нужного текста на странице (с помощью Ctrl + C или вызова контекстного меню правой кнопкой мыши - Копировать). Если вы все настроили корректно, то на шкале событий вы увидите достижения JS-целей:

Событие скопированного текста

А перейдя на вкладку Console, в параметрах событий должны отображаться два переданных параметра со значениями самого текста и его длины:

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

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

Пример переданных параметров событий в Яндекс Метрику:

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

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

🔥 Новый онлайн-курс по вайбкодингу! Живой поток. Старт 26 октября!
ПОДРОБНЕЕ