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

27 апреля, 2026

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

Для отслеживания интереса пользователей к контенту вашего сайта полезно знать не только о кликах по кнопкам и ссылкам, но и о намерениях сохранить информацию физически. В браузерах за это отвечает событие beforeprint. Это часть Web API, которая срабатывает в момент, когда пользователь инициирует печать страницы. Оно запускается до появления окна предварительного просмотра печати, как только пользователь:

нажал комбинацию клавиш Ctrl + P (или Cmd + P на MacOS);
вызвал контекстное меню правой кнопкой мыши и нажал Печать в меню браузера;

Контекстное меню - Печать

выполнил в коде команду window.print().

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

Использование этого события в связке с JavaScript позволяет гибко управлять процессом взаимодействия с пользователем: от технической подготовки документа (например, скрытия лишних навигационных кнопок и баннеров) до фиксации глубокого вовлечения аудитории. А отправка данных в системы аналитики (Яндекс Метрику, Google Analytics 4 и другие системы) в момент срабатывания события beforeprint дает возможность отследить ценные действия пользователя, которые часто остаются незамеченными.

Хотите лучше всех разбираться в Яндекс Тег Менеджере? Пройдите обучение уже сейчас!

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

beforeprint - очень «старое» и надежное событие. Оно появилось еще в Internet Explorer 5.0 (что редкость для хороших функций) и сейчас поддерживается абсолютно всеми современными браузерами: Chrome, Firefox, Safari (с версии 13), Edge и Opera. Существует также парное событие afterprint. Оно срабатывает, когда пользователь уже либо нажал Печать, либо закрыл окно предпросмотра.

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

Настройки - Счетчик

И включите функцию Пользовательский HTML:

Активация пользовательского HTML

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

Сохраните изменения.

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

Триггер "Просмотр страницы"

Задайте ему название (например - Просмотр страницы) и сохраните его.

Теперь откройте раздел Теги и создайте тег типа Пользовательский HTML. Вставьте в него нижеприведенный код без каких-либо изменений:

<script>
(function() {
    var printed = false;

    window.addEventListener('beforeprint', function() {
        if (!printed) {
            // Инициализируем dataLayer, если он еще не создан
            window.dataLayer = window.dataLayer || [];
            
            window.dataLayer.push({
                'event': 'onBeforePrint',
                'currentURL': window.location.pathname
            });
            
            printed = true;

            // Сбрасываем флаг через секунду, чтобы разрешить повторную отправку при новой печати
            setTimeout(function() {
                printed = false;
            }, 1000);
        }
    });
})();
</script>

(function() {

var printed = false;

window.addEventListener('beforeprint', function() {

if (!printed) {

// Инициализируем dataLayer, если он еще не создан

window.dataLayer = window.dataLayer || [];

window.dataLayer.push({

'event': 'onBeforePrint',

'currentURL': window.location.pathname

});

printed = true;

// Сбрасываем флаг через секунду, чтобы разрешить повторную отправку при новой печати

setTimeout(function() {

printed = false;

}, 1000);

}

});

})();

</script>

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

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

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

Принцип действия скрипта прост: как только пользователь инициирует печать страницы, срабатывает браузерное событие beforeprint. В этот момент скрипт отправляет в уровень данных (dataLayer) событие с названием onBeforePrint. Его можно использовать в качестве триггера для активации любых тегов аналитики и передавать данные в Google Analytics 4 или Яндекс Метрику. Кроме того, вместе с событием передается переменная currentURL, которая фиксирует точный URL-адрес страницы, контент которой пользователь планирует распечатать.

После создания HTML-тега перейдите в раздел Триггеры и создайте триггер типа Специальное событие. Укажите название события - onBeforePrint:

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

А для передачи данных о странице, на которой произошло событие, создайте пользовательскую переменную типа Переменная уровня данных с именем currentURL:

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

Сохраните настройки. Теперь вы можете создать тег, например, для Яндекс Метрики, чтобы передать это событие в отчеты аналитики. Но перед тем, как вы это сделаете, зайдите в раздел Цели и создайте цель типа JavaScript-событие. В качестве идентификатора цели задайте произвольное название, например - printing:

Цель в Яндекс Метрике

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

Шаблоны из каталога

И в открывшемся окне добавить тег Яндекс Метрика (Передача информации о достижении цели):

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

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

Укажите свои данные:

ID счетчика - вставьте идентификатор вашего счетчика Яндекс Метрики. Он отображается вверху страницы;
Идентификатор цели - задается на странице редактирования счетчика при создании или изменении цели типа JavaScript-событие. В моем примере - printing.

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

{"URL-адрес страницы печати":"{{DLV - currentURL}}"}

1	{"URL-адрес страницы печати":"{{DLV - currentURL}}"}

, где DLV - currentURL - название вашей переменной уровня данных для извлечения текущего URL-адреса страницы, на которой произошло событие.

Пример в Яндекс Тег Менеджере:

Добавление параметра события

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

Отслеживание печати веб-страниц для Яндекс Метрики

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

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

Откройте любую страницу на вашем сайте для тестирования печати и выполните одно из представленных действий:

нажмите комбинацию клавиш Ctrl + P (или Cmd + P на MacOS);
вызовите контекстное меню правой кнопкой мыши и нажмите Печать в меню браузера.

На шкале событий должно отобразиться событие onBeforePrint:

onBeforePrint на шкале событий режима отладки ЯТМ

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

Активированный тег Яндекс Метрики

А раскрыв его, дополнительно сможете перепроверить все данные:

ID счетчика Метрики;
идентификатор JavaScript-события;
переданный параметр события: URL текущей веб-страницы, на которой произошло событие. Для этого в опции Отображать переменные как переключитесь с Имена на Значения.

Детальные сведения о теге

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

Значение переменной уровня данных на вкладке "Переменные"

Через некоторое время данные по достигнутым целям отобразятся в Яндекс Метрике в отчете Конверсии:

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

Самое подробное и системное обучение Яндекс Тег Менеджеру! Подробнее!

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