Что такое Google Tag Assistant Recordings. Подключение Google Analytics через GTM

Не беда. Есть один способ, как это можно осуществить. Хотя сейчас он работает только на некоторых устройствах. Вообще, перенос помощника на другие Android-устройства с версией Marshmallow и выше уже в процессе. Пока же можно воспользоваться приложением Google Allo. Ходят слухи, что Google пока еще дорабатывает интерфейс. Вместе с тем компания OnePlus недавно заявила, что Google Assistant будет совместим со смартфонами OnePlus 3 и OnePlus 3T.

Что представляет собой Google Assistant?

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

Другие варианты получения помощника

Раньше на смартфонах (отличных от Google Pixel) с Android 5.0 Lollipop и выше можно было заполучить Google Assistant, используя установочный файл APK альфа-версии Google App. Впрочем, сейчас этот способ неактуален, так что даже пробовать не имеет смысла. Надеемся, что вскоре Google расширит список смартфонов, поддерживающих Assistant. Ну а пока мы советуем нашим читателям обратить внимание на Google Allo.

А что вы думаете насчет ассистента от Google? Пробовали ли установить его на своем устройстве? Поделитесь своим опытом в комментариях.


После внедрения кода отслеживания Google Analytics или его настройки через Google Tag Manager необходимо организовать проверку корректности собираемых данных.

Для этого могут быть использованы различные инструменты. В Google для проверки корректности работы тегов своих систем создали свой инструмент - Google Tag Assistant, который устанавливается как плагин к браузеру. Я буду рассматривать работу плагина в браузере Chrome.

После установки в списке значков плагинов у появится новый, при клике на который левой кнопкой мыши откроется следующее окно:

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

Вы увидите сообщение, что Google Tag Assistant не активен (отключен) на текущей странице и вы можете включить его:

Для включения необходимо нажать Enable (про возможность записи, кнопка Record , поговорим ниже).

После включения плагина необходимо перезагрузить страницу, чтобы информация по ней отобразилась в Google Tag Assistant, либо перейти на следующую. Вне зависимости от действия в следующий раз Google Tag Assistant “соберет” необходимую информацию и она станет доступна для просмотра. При этом в списке плагинов у Google Tag Assistant появится дополнительная информация в виде количества тегов, обнаруженных на текущей странице:

Google Tag Assistant – количество тегов

Если кликнуть левой кнопкой мыши на этом значке, отобразится окно:

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

  • зеленый – если тег сработал корректно;
  • синий – если есть не критичные замечания;
  • красный – имеются серьезные ошибки.

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

В верхней правой части окна выводится информация об общем количестве тегов на странице, а при наличии ошибок и их количество:

Возможна ситуация, когда теги не будут обнаружены на странице, в этом случае информация выглядит таким образом:

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

Отобразится подробная информация по тегу (на примере Google Analytics):

На что необходимо обратить внимание. Первое это способ внедрения Google Analytics, на скриншоте это Implemented in Google Tag Manager , т.е. через Google Tag Manager, второе на количество хитов, которые были отправлены тегом до того, как вы открыли это окно:

Здесь отображается тип хита, например, Events (события) и количество хитов этого типа (1 в зеленом круге).

Выбрав тип хита вы “погружаетесь” в список хитов выбранного типа (конечно если их несколько), где можно узнать сведения, которые были переданы в Google Analytics:

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

Помните, в начале я упоминал кнопку Records ? Она необходима для записи тегов на страницах и другой информации, чтобы ее не просматривать каждый раз на странице, а выполнить переходы по ссылкам внутри сайта, после чего изучить собранную информацию по каждой странице. Чтобы воспользоваться этим отчетом откройте окно Google Tag Assistant и нажмите кнопку Record . Вы увидите предупреждение:

Ознакомьтесь с информацией, при необходимости активируйте переключатель, чтобы отслеживать переходы между вкладками. Для окончания записи нажмите кнопку Cancel recording .

Теперь после перезагрузки страницы или перехода по ссылке на ней Google Tag Assistant начнет фиксировать и записывать информацию. В списке плагинов у значка Google Tag Assistant появится дополнительное обозначение в виде красного круга, которое указывает на активность опции записи:

Вы выполняете навигацию по страницам, Google Tag Assistant записывает информацию. Если необходимо завершить запись или ознакомиться с записанными сведениями откройте окно Google Tag Assistant и выберите необходимое действие в нижней части страницы:

Перед просмотром информации отображается сообщение:

Вам предоставляется возможность просмотреть отчет Show full report или возобновить/продолжить запись Resume recordind . Для просмотра отчета вам потребуется пройти авторизацию на Google.

Информация отображается в отдельной вкладке браузера и делится на два блока:

Отчет по Google Tag Assistant и информация по Google Analytics. От того, какой вариант вы выбрали зависит дальнейшая работа и внешний вид страниц. Изучая различные параметры можно выявлять ошибки и не точности, допущенные при внедрении Google Analytics. Доступна масса параметров и информации:

Используйте Google Tag Assistant при внедрении и настройке Google Analytics, но не забывайте, что лучше использовать не один, а несколько инструментов, которые будут дополнять друга-друга помогая вам решать текущие задачи.

Октябрь 21, 2017

После необходимо выполнить проверку корректного сбора данных. Сделать это можно с помощью инструмента Google Tag Assistant .

Google Tag Assistant – расширение для браузера Google Chrome, которое позволяет записывать последовательность действий, выполняемых пользователями, поддерживает анализ тегов во многих продуктах Google — AdWords, DoubleClick, . Он также помогает отслеживать правильность установки кода, находить и исправлять проблемы, которые могут привести к искажению данных в ресурсах и представлениях Google Analytics.

Отличить достоверные данные от недостоверных может быть непросто. А на выявление и устранение ошибок в работе сайта, как правило, требуется немало времени, денег, и усилий. Google Analytics – сильный инструмент веб-аналитики, имеющий собственную службу диагностики неполадок и ошибок. В ходе работы проверяется:

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

Для каждой проблемы предлагается решение. Эти данные отображаются в верхнем правом углу (значок «колокольчика» ).

Оповещения Google Analytics

Но у Analytics есть ряд ограничений:

  • только после сбора первичных данных возможна диагностика, а заранее отфильтровать недостоверную информацию не представляется возможным;
  • для выявления неполадок и ошибок на сайте аналитике нужен определенный объем данных. Чем больше данных, тем больше недостоверной информации может накопиться (см. пункт выше);
  • Analytics не может сканировать страницы, которые требуют аутентификации или входа с паролем;
  • Analytics не всегда корректно сканирует динамические страницы (в URL которых содержится символ «?»).

Именно в таких ситуациях на помощь приходит функция Google Tag Assistant Recordings (GTAR) , позволяющая регистрировать теги, и взаимодействия для любой последовательности посещенных страниц или сайтов, и тех страниц, которые открывал пользователь, даже если часть из них находится за пределами основного домена.

Это часто встречается при переадресации пользователя со страницы сайта на сервис онлайн-оплаты. Будь у вас интернет-магазин товаров с электронной торговлей или продающий сайт с видеокурсами — чаще всего, пользователю, чтобы оплатить заказ, необходимо перейти на сайт платежей. В этом случае Google Analytics создаст дополнительный сеанс, который приведет к искажению данных. Решением данной проблемы станет добавление домена платежного сайта в исключаемый источник перехода.

Кроме этого, Tag Assistant позволяет быстро определить страницы, на которых не установлен код Google Analytics. Больше не нужно проверять сайт вручную и просматривать все данные в поисках отсутствующей страницы. GTAR может выполнять проверку тегов не только в других продуктах Google, но и на сторонних сайтах.

Еще одной распространенной проблемой является ошибка «Page took a long time to send pageview hit to Analytics» (Передача данных о просмотре страницы в Analytics занимает слишком много времени) . Она возникает при долгой загрузке страницы. Если она открывается слишком долго, код Google Analytics находится в той части страницы, которая не загрузилась, а пользователь уже закрыл ее, то обращение не будет зарегистрировано или будет передано с задержкой, что также повлияет на статистику в отчетах.

Есть другие оповещения Google Tag Assistant Recordings и способы устранения неполадок. Ознакомиться с информацией можно в официальной справке Google . Давайте теперь перейдем непосредственно к установке этого расширения.

  • Переходим по ссылке
  • Устанавливаем расширение

Расширение Google Tag Assistant

  • После установки в правом углу активируем наше расширение, выбрав те теги, которые хотим отслеживать, а также какие страницы попадают под проверку (все или выбранные):

Настройка отслеживания Tag Assistant

Google Analytics – код отслеживания GA-, UA-, и Global Site Tag;

Google Trusted Stores — это бесплатная программа сертификации интернет-магазинов. Владельцы таких сайтов получают специальный значок (отображается в торговых кампаниях на поиске), показывающий, что покупатели положительно отзываются о магазине, считают его надежным, высоко оценивают качество услуг и подтверждают гарантию доставки. На момент написания статьи доступно в Великобритании, Франции, Германии, Австралии и Японии;

Google Trusted Stores для интернет-магазинов

AdWords Conversion Tracking / Remarketing – конверсии и тег ремаркетинга Google AdWords;

Floodlight – функция для DoubleClick Campaign Manager (DCM), позволяющая рекламодателям отслеживать и создавать отчеты по конверсиям – действиям пользователей, посещающих страницу после просмотра или клика по объявлению;

DFA / DFP (DoubleClick for Advertisers (DFA), DoubleClick for Publishers (DFP)) — комплексная платформа для показа рекламы;

Google Publisher Tags (GPT) – библиотека тегов объявлений, позволяющая создавать динамические запросы объявлений для DoubleClick for Publishers (DFP).

  • Оставляем все без изменений и нажимаем Done .
  • В результаты вы увидите сообщение о том, что Google Tag Assistant не активен (отключен). Для его активации нажмите на Enable:

Активация Tag Assistant

  • Затем необходимо перезагрузить страницу, чтобы информация отобразилась в Google Tag Assistant. Значок может менять цвет и показывать различные числа в зависимости от того, какие теги обнаружены.

Обнаруженные теги на странице сайта

  • зеленый — ошибок в теге не обнаружено;
  • синий — тег размещен с незначительными ошибками. Также этим цветом помечаются советы по оптимизации тегов;
  • желтый — размещение может привести к непредвиденным последствиям;
  • красный — критическая ошибка. Такой тег может работать неверно и привести к искажению или потере данных в ваших отчетах.

На моем сайте установлен только код Universal Analytics. Тег работает корректно. Если Tag Assistant не найдет на странице код Google Analytics, выдаст такое оповещение:

Тег не найден

Для получения дополнительной информации по тегу следует просто нажать на него:

Теги на странице

Отобразится подробная информация (на примере моего Google Analytics):

Данные по тегу UA

Примечание: второй тег UA-1410476 на моем сайте отображается на всех страницах с публикациями материалов, где присутствует плагин Disqus. Он используется разработчиками для отслеживания комментариев пользователей. Код UA- автоматически встроен в iframe плагина, поэтому вам ничего не нужно с ним делать.

  • Metadata – вкладка с основными данными по тегу (номер счетчика, версия и протокол)
  • Code Snippet – отображает код счетчика на данной странице целиком
  • Cookies – информация куки по моему сеансу
  • Pageview Requests – это количество запросов на просмотр конкретной страницы
  • Events – события на данной странице

В зеленом кружке отображается количество совершаемых действий в данный момент времени. Все они передаются в Google Analytics. «Провалившись» внутрь события, можно увидеть категорию события. В данном случае это New Visitor – новый посетитель.

Событие «Новый посетитель»

Вернуться назад можно с помощью стрелочки вверху экрана:

Возврат на предыдущий шаг

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

Воронка – Показать / Скрыть теги

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

В зависимости от показа / скрытия элемента напротив тега нажимаете «крестик» или «плюсик»:

Скрыть тег в Tag Assistant

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

Скрытые теги

Звездочка — Добавить в избранное

Любой домен, в том числе и конкурента, можно добавить в избранный список, чтобы в дальнейшем Tag Assistant анализировал сценарии, загруженные с конкретной страницы, для любых тегов в фоновом режиме. Эту функцию можно использовать для тех страниц, которые не имеют ошибок или же наоборот, которые требуют повышенного внимания. В настройках можно добавить

Для этого просто активируйте на нужной вам странице звездочку.

Добавить в избранное

Список всех избранных доменов / страниц находится в настройках расширения.

Шестеренка – Настройки

При клике на данный значок мы попадаем на основные настройки данного расширения.

Настройки Tag Assistant

Здесь мы видим My Favorites лист (добавленных в избранное), а также опции:

  • Ignore external scripts – игнорировать внешние скрипты;
  • Recording: Follow Links Across Tabs — если галочка стоит, то во время записи Tag Assistant будет отслеживать переходы между вкладками;
  • Auto open recordings report when recording is stopped – когда запись будет остановлена, в новой вкладке будет автоматически открываться полученный отчет.

Level of detail – Уровень детализации

Для каждого тега Google можно установить уровень детализации «Off», «Basic» или «Detail».

  • Off (выключен) – информация по тегу не записывается;
  • Basic (базовый) — будет предоставляться отчет об ошибках, а также минимальная информация о теге, такая ​​как идентификатор учетной записи;
  • Detailed information (подробная информация) — отчетность об ошибках, а также расширенная информация для устранения проблем: полный URL-адрес запроса, полный скрипт отслеживания и источник сценария.

В правом верхнем углу есть две кнопки. Вы можете просмотреть все ошибки и подробные руководства по их устранению, нажав на « List checks» , а также сбросить все настройки Tag Assistant кнопкой « Reset to default» .

Меню в виде трех точек

Меню Tag Assistant

  • Show in separate tab – Tag Assistant открывается на отдельной вкладке браузера;
  • Recheck DOM – перепроверка на поддержку стандартов «W3C DOM». Document Object Model - это инструмент, с помощью которого JavaScript видит содержимое HTML-страницы и состояние браузера;
  • Auto Validation OFF / ON – когда параметр отключен, Tag Assistant автоматически не анализирует теги Google на страницах сайта;
  • GA Debug OFF / ON – когда отладчик отключен, Tag Assistant не извлекает информацию из него и не получает подробные данные.

Теперь попробуем записать последовательность действий от захода на сайт через поиск до покупки / оформленного заказа. Это будет выглядеть так:

  • включаем запись кнопкой Record. Ставим галочку на Recording: Follow Links Across Tabs
  • переходим на сайт
  • выполняем на нем те действия, которые хотим проверить
  • останавливаем запись
  • анализируем отчет
  • Включить запись Tag Assistant Recordings

    Google Tag Assistant начнет фиксировать и записывать информацию после нажатия на кнопку Record. В списке плагинов у значка появится дополнительное обозначение в виде красного круга:

    Запись Tag Assistant Recordings включена

    Остановить запись и Посмотреть запись

    Выбираем Show Full Report (Показать весь отчет) или же продолжаем запись (Resume Recording ) :

    Посмотреть полный отчет Tag Assistant

    Tag Assistant Report и Google Analytics Report

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

    Примечание: расширения Chrome автоматически отключаются в режиме инкогнито, поэтому данные по действиям пользователей в Tag Assistant не записываются.

    • Vk.com —
    • Tutorial

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

    • проблема избытка кода Google в коде страниц (отслеживание событий, Google A/B tests, Google Analytics)
    • неудобство управления и слежения за скриптами.
    • постоянная необходимость редактирования шаблонов страниц, для внесения изменений и дополнительных параметров в скрипты.
    • зависимость от релизов на поддоменах (индивидуальный случай). Например, над личным кабинетом работает не один человек, а команда разработки с использованием контроля версии (VSC) и для внесения малейших изменений приходилось ждать очередного релиза.
    В данной статье мы рассмотрим решение данных проблем на примере Google Analytics, посредством Диспетчера тегов от Google (Google Tag Manager) и рассмотрим новую модель организации работы со скриптами, для анализа работы сайта с практическими примерами и кучей картинок.

    Речь пойдет о Google Tag Manager (диспетчер тегов Google).

    Основные преимущества перехода на диспетчер тегов на наш взгляд:

    • минимум кодинга на страницах. Убираем все скрипты от Google из кода страниц. Останется лишь код вставки Диспетчера тегов (код контейнера)
    • прозрачность и удобство. Удобство настройки и слежения за скриптами. Все управляется и настраивается из панели управления Диспетчера тегов. Мы видим все скрипты и к каким страницам и событиям они привязаны
    • масштабируемость. Больше не нужно затрагивать код страниц. Вы можете добавлять и настраивать код Google Analytics, отслеживания конверсий AdWords, ремаркетинга AdWords и много другого из личного кабинета диспетчера тегов.
    • система контроля версий. Любые изменения можно с легкостью отменить и вернуть на более ранний state, а так же следить за тем, кто, где и когда вносил изменения.
    • режим многопользовательской работы.
    Также, если у вас имеется ресурс, который разрабатывается с использованием контроля версий и чтобы внести изменения в код страниц, приходится ждать очередного релиза, тогда Диспетчер тегов Google - это именно то, что вам нужно.Немного теоретической части

    Для быстрого старта, нам понадобиться разобрать основные термины, которые необходимы для начала работы с Google Tag Manager, а именно:

    • Аккаунт
    • Контейнер
    • Правила
    • Макросы
    Эти термины будут встречаться как в статье, так и в любой документации от Google.

    Аккаунт - это аккаунт=) как и в Google Analytics, в представлении не нуждается.

    Контейнер - это главный и единственный фрагмент JS-кода, который мы вставляем на все страницы сайта. По сути, он является тегом, но его функция заключается в том, что он служит контейнером для всех тегов. О них написано чуть ниже. Своего рода «архитег», который запускает все остальные теги, при соответствии их правилам которые мы задали.

    Тег - это фрагмент JS-кода. Все те скрипты, которые мы раньше вручную вставляли на страницы сайта, например, код Google Analytics, код отслеживания конверсий Adwords, пользовательский код и т.д.

    Правило - это условие, при котором будет вызываться и выполняться тег или наоборот (блокироваться). Например, для кода Google Analytics правилом «выстрела» мы зададим: «на всех страницах».

    Макросы - «Макросы являются парами типа имя/значение, для которых передаются значения в процессе работы». Используются при настройке правил. В нашем случае, переменные уровня данных для отслеживания событий (Event Tracking) в связке с целями Google Analytics, подробнее в практической части

    Обобщим, в коде страницы имеется код контейнера. В контейнер с сервера Google подгружаются и активируются теги, которые соответствуют правилам активации. Макросы нужны для настройки тегов и правил.


    Рис.1 Схема взаимодействия элементов

    Практический пример А теперь рассмотрим вышеперечисленное на простейшем примере с использованием основных возможностей.

    У Google есть замечательный инструмент в виде плагина для Google Chrome - «Tag Assistant» . Устанавливаем и вернемся к нему чуть позже.

    Итак, предположим, имеется:

    • сайт - example.com
    • личный кабинет на поддомене - accounts.example.com
    Необходимо:
    • разместить код Google Analytics
    • настроить отслеживание конверсии при клике на определенную кнопку
    Регистрируем Google Analytics и Google диспетчер тегов.
    В диспетчере тегов создаем аккаунт (рис.2).


    Рис.2 Создание аккаунта

    Далее создаем контейнер (рис.3). Указываем тип: «Веб-страницы» или «Мобильные приложения» и указываем наши домены(что, в принципе, необязательно). В нашем случае, поддомен мы не указываем, поскольку будем использовать междоменное отслеживание.


    Рис.3 Создание контейнера

    Готово! нам дают тот самый заветный код контейнера, который мы должны разместить сразу же после открывающего тега.

    Код контейнера обязательно и всегда должен быть самым первым после открывающего тега, в противном случае вы рискуете потерять возможность отслеживания событий (Event Tracking) находящих ДО кода контейнера. Поскольку все переменные уровня данных, которые находятся до Диспетчера тегов, обрабатывать не будут.
    Для большей гибкости и удобства - для основного домена и поддоменов лучше использовать разные контейнеры.

    Там же - нам предлагают одним нажатием вставить теги. Выбираем тег «Google Analytics»(рис.4)


    Рис.4 Код контейнера и меню выбора тегов

  • ввести «идентификатор веб-ресурса» - это старый добрый код счетчика
  • «добавить правило активации тега» - там ставим галочку напротив «все страницы». то есть код Google Analytics будет срабатывать на всех страницах сайта.
  • так как у нас имеется поддомен - открываем вкладку
  • «Дополнительные настройки» > «Домены и каталоги» и ставим галочку напротив «разрешить связывание» (это и есть междоменное отслеживание)


  • Рис.5 Настройка тега Google Analytics

    С тегом Google Analytics закончили. Следующим этапом мы настроим макрос на отслеживание событий (Event Tracking). Нам понадобится создать 3 макроса, а потом на основе них - тег отслеживания.

    Итого, у вас должно получиться 3 новых макроса с именами переменных уровня данных: eventCategory , eventAction , eventLabel . В качестве правила для активации, нам еще понадобиться макрос «event», но он уже создан по умолчанию.


    Рис.6 Создание макроса

    Далее создаем новый тег, выбираем тип тега - «Google Analytics», вставляем тот же код счетчика в поле идентификатора, а вот в типе отслеживания - выбираем «событие» и далее вставляем созданные нами макросы из списка, соответственно:

    • категория - GA Event Category
    • действие - GA Event Action
    • ярлык - GA Event Label


    Рис.7 Создание тега отслеживания Google Analytics

    Теперь нам нужно задать правило активации тега (рис.8). Создаем новое правило, в котором мы используем макрос «event»


    Рис.8 Создание правила активации

    Как это работает? переменные уровня данных, у нас будут передаваться в таком виде:

    Так как мы не хотим затрагивать код страниц, привязываем действие по клику с помощью jQuery и подключаем через Google Tag Manager(пользовательский тег), подобным образом:
    $(document).ready(function(){ $("селектор нужного объекта").click(function() { dataLayer.push({"event":"GAevent", "eventCategory":"Заданное нами значение", "eventAction":"Заданное нами значение", "eventLabel":"Заданное нами значение"}); }); });


    Рис. 9 Добавляем пользовательский тег

    То есть, при клике по объекту, мы будем передавать переменные уровня данных методом .push() и теми значениями, которые мы будем задавать в целях Google Analytics.

    Итак, у нас вышло 4 наших макроса: «event», «eventCategory», «eventAction», «eventLabel»
    и четыре пары значений:

    • ‘event’ : ’GAevent’
    • ‘eventCategory’ : ’value’
    • ‘eventAction’ : ’value’
    • ‘eventLabel’ : ’value’
    Значения мы задаем в панели Google Analytics, в «настройках цели».

    Чтобы нагляднее проследить взаимосвязь - см. рис.10


    Рис. 10 Взаимосвязь переменных уровня данных, макросов и целей Google Analytics

    Создаем цели в Google Analytics, вставляем переменные в наш метод dataLayer.push() для ссылки которую будем отслеживать.


    Рис. 11 Создание версии и публикация контейнера

    Проверяем: перейдя на страницу сайта открываем «Tag Assistant», о котором говорилось в самом начале практической части.

    Рис.12 окно Tag Assistant

    Мы видим код нашего счетчика, код контейнера. Зеленый статус «working» говорит о том, что всё отличненько. В противном случае, он бы описал проблему и предложил рекомендации к ее решению. Также, мы видим наш Data Layer.(зачастую, данные dataLayer не отображаются в панели "tag assistant" и это норма).

    Вот и всё.

    Ну и так вот, на дорожку:
    Рассмотренное в данной статье - лишь малая и простейшая часть того, что на самом деле представляет из себя Диспетчер тегов (Google Tag Manager) и какие возможности открываются перед нами при углублении во все нюансы.

    Запущенный в 2012 году, диспетчер тегов Google (Google Tag Manager) помогает маркетологам и веб-мастерам решить важную задачу — встраивание в страницы фрагментов кода, которые отслеживают нужные показатели на сайте. До появления диспетчера встраивание кода в сайт было рискованной штукой без каких-либо гарантий, что всё заработает правильно с первого раза.Также не было гарантий, что вы получите те показатели, которые хотели, а куча запускавшихся сниппетов могла прилично замедлить скорость загрузки сайта.

    Диспетчер тегов Google избавляет от перечисленных неудобств, предлагая шаблоны для легкого встраивания фрагментов кода (на языке Google — “тегов”) и обеспечивая асинхронный запуск тегов для ускорения загрузки сайта. А обновленная редакция этого инструмента получила более понятный интерфейс и поддержку большого числа тегов, полезных маркетологам и веб-мастерам.

    Как утверждается в Справке по диспетчеру тегов Google, с ним “экономится время, сокращается количество ошибок и отпадает необходимость обращаться за помощью к разработчику”. Но правда ли эта система настолько простая в освоении, что может использоваться обычным пользователем? Попробуем разобраться.

    Словарь диспетчера тегов Google для “чайников”

    Для начала познакомимся с некоторыми понятиями из мира диспетчера тегов Google.

    Тег — это фрагмент кода, который выполняется на странице сайта. Когда тег начинается выполнятся, мы говорим, что он активируется .

    Триггер — это механизм, который активирует тег. Он проверяет выполнение нужных условий, и в зависимости от результата активирует или не активирует тег. Например, если вы встроили код для отслеживания статистики, условием активации тега будет каждое посещение страницы пользователями.

    Переменные помогают указать диспетчеру, где и когда должен активироваться тег. Уровень данных хранит информацию, которую нужно передать диспетчеру тегов.

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

    Вооружившись базовыми понятиями, попробуем встроить фрагмент кода с помощью диспетчера тегов Google.

    Встраивание Universal Analytics через диспетчер тегов

    Рассмотрим процесс встраивания тегов на примере небольшого сайта, который работает на WordPress. Перед использованием диспетчера Google рекомендует проверить какие теги (код для отслеживания) вы уже используете на своем сайте.

    Если вы относитесь к редким людям, не имеющим аккаунта Google, ликвидируйте этот пробел до начала работы с диспетчером тегов. Если же у вас есть несколько аккаунтов Google, перейдите в тот, через который вы работаете (или собираетесь работать) со своими сайтами. Теперь перейдем непосредственно к диспетчеру.

    Шаг 1: создание аккаунта

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

    В аккаунте будет храниться идентификатор контейнера для вашего сайта. Вам нужно выбрать тип контейнера (веб, iOS или Android) и нажать кнопку “Create” (“Создать”). После этого в выпадающем окне вы получите код для установки диспетчера тегов.

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

    Шаг 2: создание тега

    Теперь нужно создать тег. Выберите надпись “NEW TAG” (“Новый тег”), затем выберите тег, который хотите добавить.

    Называйте тег просто и понятно. Например, можно использовать аббревиатуру из названия сайта и типа тега, который используется.

    Шаг 3: добавляем идентификатор отслеживания

    Найдите идентификатор отслеживания для своего сайта в аккаунте Google Analytics. Он указан во вкладке “Администратор” в разделе “Ресурс” — “Код отслеживания”. Скопируйте идентификатор и вставьте его в нужную строку в окне настройки тега в диспетчере тегов.

    Шаг 4: указываем условия отслеживания

    Теперь выберите, какой параметр вы хотите отслеживать. Для аналитики это обычно просмотры страниц. На этом шаге вы можете также выбрать условия активации тега. Используйте для аналитики триггер “Все страницы”.

    Шаг 5: устанавливаем идентификатор диспетчера тегов на свой сайт

    Если вы уже установили диспетчер тегов на свой сайт (код для вставки был получен в шаге 1), следующим шагом станет публикация контейнера. В противном случае нужно подготовить сайт к публикации. В ресурсах на WordPress можно использовать специальные плагины для установки диспетчера тегов Google, например, DuracellTomi’s Google Tag Manager. С их помощью идентификатор диспетчера тега устанавливается даже с нулевым знанием программирования.

    Шаг 6: предпросмотр и публикация

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

    В режиме предпросмотра вы увидите, какие теги активируются.

    Если вас всё устраивает, жмите на кнопку “Publish” (“Опубликовать”). С этого момента диспетчер тегов начнет отслеживать теги, триггеры и переменные. Каждый раз, когда вы добавляете что-то новое, создается новая версия контейнера. После публикации она становится текущей версией, с которой работает сайт. В панели навигации диспетчера можно найти все предыдущие опубликованные версии контейнера.

    Шаг 7: удаляем дублирующий код

    Скорее всего, вы использовали на своем сайте инструменты для аналитики от Google и до появления диспетчера тегов. Чтобы получать правильную достоверную статистику, вам нужно удалить старый код и управлять аналитикой только через диспетчер тегов.

    Убедиться, что на сайте запущен только один код для отслеживания статистики, поможет плагин для браузера Chrome — Google Tag Assistant.

    Шаг 8: проверяем статистику

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

    После установки и активации первого тега работать с диспетчером становится гораздо проще. Например, добавим на сайт тег с многообещающим названием Crazy Egg. На главной странице нажимаем кнопку “Аdd new tag”, выбираем в уже знакомом окне из списка тегов Crazy Egg.

    Устанавливаем триггер, затем делаем предпросмотр и публикуем новую версию контейнера.

    Как мы убедились, работать с диспетчером тегов под силу даже очень далекому от кодинга человеку. Не поленитесь дополнительно изучить Справку по Диспетчеру тегов Google, чтобы этот инструмент на самом деле облегчил вам жизнь, а не превратился в новую головную боль.