1. Пользовательский HTML
2. Пользовательское изображение
У тегов, которых нет встроенных шаблонов в GTM, используется категория «Специальные теги». К ним относятся, например, коды Яндекс.Метрика, Facebook Pixel, Ретаргетинг ВК и другие.
Пользовательский тег HTML – это код стороннего сервиса, который должен быть заключен внутри тегов <script></script>. Вот так выглядит пользовательский HTML тег счетчика Яндекс.Метрика:
Рис. 400. Пользовательский HTML-тег, Яндекс.Метрика
Вы также можете включить вызовы функции document.write() в тегах, установив соответствующий флажок.
Рис. 401. Поддержка функции document.write
document.write() – метод добавления текста к документу. Он работает только пока HTML-страница находится в процессе загрузки и дописывает текст в текущее место HTML еще до того, как браузер построит из него DOM. Подробнее об этом методе читайте на learn.javascript.ru.
Также в пользовательский HTML тег можно вставлять встроенные и пользовательские переменные. Для этого используют конструкцию двойных фигурных скобок {{myVariable}}.
Рис. 402. Вставка переменных в HTML-тег
Помогает отслеживать поведение пользователей там, где не работают остальные теги (например, в браузерах с отключенным выполнением скриптов). В конце ссылки добавляется невидимый пиксель изображения с URL-адресом определенного формата со специальными параметрами. По ним происходит передача данных.
Universal Analytics, Пользовательский HTML и многие другие теги работают на основе JavaScript. Если они загружаются на странице, на которой отключена поддержка JavaScript, то теги не сработают.
В связи с этим разработчики Google предусмотрели возможность загрузки через тег <iframe>. А он, в свою очередь, загружается частью контейнера <noscript> и показывает свое содержимое, если браузер не поддерживает работу со скриптами или их поддержка отключена пользователем. В остальных случаях браузер игнорирует этот тег и все, что располагается внутри него.
Именно для этих целей и нужна вторая часть кода контейнера Google Tag Manager, которую Google просит разместить после открывающего тега <body>:
Рис. 403. Фрагменты кода контейнера GTM
Наиболее частое применение тега «Пользовательское изображение» в GTM – отслеживание посещений для пикселя Facebook. У этого типа тега всего две настройки:
Рис. 404. Настройки пользовательского изображения
● URL изображения – поле, где содержится адрес изображения со всеми параметрами, которые нужно передать;
● Включить блокировку кэша (параметр gtmcb по умолчанию) – при включении обращения будут регистрироваться в том числе с браузеров с кэшированным изображением.
Знаете ли вы почему сайты загружаются так быстро? Одной из причин является кэширование. Первый раз, когда вы заходите на новый сайт, все статические элементы (шрифты, изображений, стили, скрипты и т.д.) загружаются во временную папку, которая будет хранить все эти файлы и в последующих заходах каждый раз показывать на соответствующих страницах. Периодически браузер проверяет, не обновились ли эти файлы на стороне сервера, и при необходимости загружает их заново.
С точки зрения пользователя – это удобно. Нет необходимости ждать очередной полной загрузки страницы. С точки зрения интернет-маркетологов и веб-аналитиков – это не очень хорошо, поскольку на странице данные не поменялись, файлы загрузились один раз во временную папку пользователя и больше отследить к ним обращения возможности нет.
Если отключить галочку параметра «Включить блокировку кэша», то тег сработает только при первой загрузке сайта, так как изображение будет загружено во временное хранилище. А при включении опции Google Tag Manager добавит параметр gtmcb к URL изображения со случайным значением. Например, так:
site.ru/image.jpeg?gtmcb=1713862799
Поскольку значение в URL всегда разное, браузеру придется каждый раз скачивать изображение. А раз это будет происходить каждый раз, то мы сможем отслеживать это событие постоянно. Поэтому этот параметр лучше всегда держать включенным.
В категории тегов «Еще» содержатся шаблоны к сервисам, которые не так популярны у нас, но которые часто используются в мире. Это и comScore Unified Digital Measurement, и тег Adroll Smart Pixel, и Criteo One Tag, и Hotjar Tracking Code, и другие. Руководства по настройке какого-либо тега из этой категории вы найдете на сайте поставщика.
Рис. 405. Теги сторонних сервисов
Обычно теги активируются при загрузке страницы или в ответ на какое-либо действие на ней. В Google Tag Manager вы устанавливаете триггеры, определяющие, когда должны активироваться теги. Например, триггер «Все страницы» будет запускать тег на всех страницах при загрузке сайта.
Рис. 406. Триггер активации – All Pages
Для тегов можно задавать как триггеры активации, так и триггеры блокировки (исключения).
Отладчик
Режим отладки (он же режим предварительного просмотра) позволяет проверить корректность настроек тегов Google Tag Manager перед публикацией контейнера, выявить текущие проблемы на этапе тестирования и снизить риск их возникновения в будущем.
Режим предварительного просмотра в GTM еще называют режимом отладки. Проще говоря – это этап, на котором обнаруживают, локализуют и устраняют ошибки. Почему не активируется тег, не срабатывает событие, не определяется переменная? Ответить на эти и многие другие вопросы поможет именно отладка.
Предположим, что в своем контейнере вы настроили какие-то теги, добавили триггеры, переменные, и теперь хотите проверить корректность их выполнения. Чтобы включить режим предварительного просмотра, в интерфейсе Google Tag Manager нажмите на кнопку «Предварительный просмотр».
Рис. 407. Предварительный просмотр
Таким образом вы активируете режим предварительного просмотра и сверху в оранжевом прямоугольнике появится надпись:
Рис. 408. Предварительный просмотр активирован
Доступны три функции:
● Обновить – если в процессе отладки, не выходя из режима, вы внесли изменения в тегах, триггерах или переменных, то после каждого такого изменения следует обновлять предварительный просмотр, иначе Google Tag Manager не увидит правок и будет показывать предыдущую версию контейнера;
● Выйти из режима предварительного просмотра – выход из режима отладки;