Содержание
- Создание аккаунта
- Базовые определения для работы
- Создание тега в Google Tag Manager
- Подключение переменных в GTM
- GTM: формирование триггеров
- Google Tag Manager в настройке Google Analytics
- Принципы создания цели в GA
- Google Tag Manager и Яндекс.Метрика
- Интеграция целей Google Tag Manager в Яндекс.Метрику
- Создание целей в Метрике для Google Tag Manager
Google Tag Manager — это инструмент, предназначенный для управления тегами с целью упрощения веб–аналитики. Он предоставляет панель управления, с помощью которой можно легко настраивать цели и нужные параметры без специализированных знаний по работе с кодами. Проделать такую настройку понадобится только один раз путем переноса фрагмента HTML кода. После этого управление будет автоматизировано работать на специальной панели.
Создание аккаунта
При регистрации профиля нужно иметь предварительно созданную почту в Google. Далее необходимо придерживаться следующего алгоритма:
Открыть Google Tag Manager, перейти в раздел «Аккаунты» и «Создать аккаунт». После необходимо придумать название проекту. Если вы администрируете несколько сайтов, название должно быть максимально информативным для понимания того, с каким именно проектом ведет работа. Опция о передаче анонимных данных в Google и другие службы — на ваше усмотрение.
Жмем далее.
Следующим этапом будет настройка контейнера. Выбор его названия так же должен быть логичным и информативным. Можно, например, вписать в него адрес сайта. Дальше нужно выбрать место использования контейнера, в данном случае — «Интернет». Выбираем «Создать».
Появляется окно с кодом, который нужно вставить на каждую страницу сайта. Его необходимо скопировать.
Выделенный код можно перенести в текстовый документ, например, блокнот. Он должен размещаться после тега <body>. Это поспособствует автоматическому отображению кода на каждой веб-странице. Чтобы выполнить эту операцию, необходимо зайти на FTP, отыскать файл с расширением index. html, поставить код туда. Это выглядит следующим образом:
При необходимости номер кода всегда можно найти в редакторе в соответствующей панели.
Базовые определения для работы
Чтобы начать оптимизацию сайта, важно понять принцип действия инструментария. Это необходимо для понимания алгоритмов работы, принципов использования технических приемов. В противном случае пользователь просто будет выполнять аналогичные шаги, руководствуясь скриншотами, но не понимая сути дела.
Работа с Google Tag Manager предполагает умение оперировать следующими понятиями:
- Тег. Основа, представляющая собой фрагмент кода, работающий через триггер.
- Триггер. Ответственен за активацию тега, связан с переменными.
- Переменная. Задает значение для ключа, действует через триггер.
Создание тега в Google Tag Manager
Сделаем один простой демонстрационный вариант. Настроим его так, чтобы он мог отображаться на всех страницах.
Указываем необходимый раздел, появляется цепочка из трех действий:
- Выбор продукта. Указываем галочку напротив нужного раздела для передачи информации в Google Analytics.
- Выбор типа тега. Рекомендуем тип Universal Analytics.
- Настройка. Для активации нужно использовать идентификатор отслеживания, выдаваемый контейнеру после регистрации.
- Условия активации. Это способы активации тега. Указываем, что он должен работать на каждой странице.
Далее выбираем опцию «Создать тег», создаем нужный элемент и указываем его название.
Полученный результат нужно оценить перед запуском в работу. Это можно сделать в правой верхней панели, выбирая стрелочку около раздела «Опубликовать». Нам нужен вариант «Предварительный просмотр»:
Возвращаемся на наш сайт с установленной системой Google Tag Manager. Снизу появляется такая панель:
Там присутствуют два важных показателя:
- Tags fired on this page — элементы, которые работают правильно.
- Tags not fired on this page — элементы, функционирующие неправильно.
Эти показатели демонстрируют, насколько правильно созданная задача была исполнена и введена в работу. Сделанный нами тег был успешно добавлен и выстрелил. Переходим обратно и публикуем изменения.
Базовый навык получен. Первый тег оставляем, с его помощью будут функционировать остальные.
Подключение переменных в GTM
Приступаем к работе со встроенными переменными, применяемыми для подключения триггеров. Переходим в меню с левой стороны, выбираем соответствующий раздел:
Ставим нужные отметки и временно сворачиваем вкладку.
GTM: формирование триггеров
Чтобы сделать триггер, необходим предварительно сделанный тег. Начальные этапы работы полностью идентичны вышеописанным. После их реализации отмечаем необходимые параметры:
- Тип отслеживания: Событие.
- Категория: test.
- Действие: click.
Имена параметров выбраны специально для теста, их можно переименовывать по-своему, как вам будет комфортно.
После присоединяем триггер, заставляющий тег срабатывать в нужной нам форме. Например, можно организовать работу так, чтобы он отслеживал клики пользователей в тексте, находящимся в нижнем блоке сайта (футере).
Чтобы добавить такую функцию, необходимо определить опознавательный элемент, связанный с выбранной нами текстовой частью. Для работы в этом направлении возвращаемся и находим код. Это можно сделать, нажав на текст правой кнопкой мыши. Находим нужный параметр класса — mt-half. Он необходим для дальнейшей работы.
Переходим обратно в Google Tag Manager. Видим раздел, в котором нам предстоит настраивать активацию. Отмечаем «Клик»:
Появляется окно «Создание триггера», где выполняются следующие настройки:
- Первый шаг — переход в раздел «Клик», что сделано ранее.
- Второй шаг — настройка триггера через раздел «Все элементы».
- Третий шаг — выбор условий, при которых он начинает срабатывать. Указываем «некоторые клики».
Далее используем переменные.
Ставим «Click Classes», mt-half.
Указываем название. Сохраняем получившийся результат в разделе редактирования.
Кнопка «Опубликовать» изменила свой цвет, что показывает возможность внести новые параметры. Но перед этим нужно проверить работу сделанных и сохраненных нами настроек через предпросмотр.
Переходим на сайт, обращаем внимание на панель:
Чтобы проверить, взаимодействуем с соответствующим текстовым разделом. Это должно изменить информацию на консоли:
Так можно проверить работоспособность тегов перед запуском в Google Tag Manager.
Google Tag Manager в настройке Google Analytics
Для передачи информации уже были проделаны важные шаги, сделанные во время создания тега:
- Указан тип отслеживания «Событие».
- Выбраны наименования для Категории и Действия.
Эта информация понадобится для формирования цели в Google Analytics.
Принципы создания цели в GA
Проще всего наглядно рассмотреть этапы формирования цели:
Переходим в личный кабинет Google Analytics, раздел «Администратор», далее «Цели».
Выбираем «+ ЦЕЛЬ», попадаем в окно, где происходит ее редактирование и создание. Это делается через установку цели, где в настройках указывается «Собственная».
Указываем наименование. У нас это — test, название можно выбрать любое. Указываем «Событие» и продолжаем настройку.
Связываем GA и GTM. Указываем в разделах «Категория» и «Действие» такие же параметры, как в теге Google Tag Manager. Сохраняем изменения.
Теперь, чтобы достичь цели, нужно еще раз нажать на текстовую часть в нижнем блоке. Отслеживание конверсии по имеющимся задачам происходит через вкладки «Отчеты» — «Конверсии» — «Цели» — «Обзор».
Представленный алгоритм действий поможет в формировании собственных целей и дальнейшей работе с ними.
Google Tag Manager и Яндекс.Метрика
Хранение данных в одном пространстве упрощает процесс анализа и уменьшает время на получение информации. GTM предоставляет такую возможность, объединяя информацию не только с собственных сервисов, но и интегрируя данные Яндекс. Метрики. Для настройки этого процесса необходимо выполнить следующие шаги:
- Создать новый тег. Для информативности он получит название test 11.
- При выборе продукта указать «Пользовательский».
Во время создания тега в html форму вставляется код счетчика, который Яндекс.Метрика дает каждому проекту. Это должно выглядеть следующим образом:
Далее выбираем в «Условиях активации» раздел «Все страницы» и создаем тег.
Работу системы также можно проверить с помощью «Предварительного просмотра», соблюдая вышеизложенные рекомендации.
О положительном результате пользователя оповестит изменение внешнего вида консоли. До изменений теги находятся в разделе «Tags not fired on this page», а после в разделе «Tags fired on this page».
Интеграция целей Google Tag Manager в Яндекс.Метрику
Чтобы интегрировать цель, сделаем новый триггер в сочетании с новым тегом. Изменим цель на другую, выбрав не взаимодействие с текстом, как в предыдущий раз, а взаимодействие с кнопкой подписки на одной из страниц. Для этого выполняем поиск куска HTML кода, идентифицирующего подходящий элемент. Выполняем это действие пошагово:
- Переходим на необходимую страницу, где нужная нам кнопка «Подписаться». Выделяем ее правой кнопкой мыши, смотрим код.
Копируем необходимое информацию о классе. У нас это — subscribemeBtn.
- Возвращаемся в Google Tag Manager и снова приступаем к созданию триггера.
- Переходя к разделу «События», выбираем вариант «Клик».
- В разделе настроек триггера нужно отметить «Все элементы».
- Для условий работы задаем параметр Click Classes с кодом subscribemeBtn.
- Сохраняем и даем название созданному триггеру.
- Переходим в раздел «Теги» и создаем новый элемент.
- При выборе продукта отмечаем вариант «Пользовательский».
- Вводим в открывшееся окно эту конструкцию:
<script>
yaCounterXXXXXX. reachGoal (‘Identifikator’);
</script>
XXXXXX соответствует счетчику, «Identifikator» — имени идентификатора.
Для условий активации указываем «Клик», включаем в работу новый триггер и не забываем сохранить изменения.
Полученные изменения необходимо опубликовать. Теперь эту конструкцию нужно привязать к показателям Яндекс.Метрики.
Создание целей в Метрике для Google Tag Manager
Коротко рассмотрим функционирование этого механизма:
- Открываем личный кабинет в Яндекс.Метрике, выбираем необходимый проект, разделы «Настройка», «Цели», «Добавить цель».
- При формировании цели указываем «Тип условия» — «Java-script-событие» и указываем идентификатор цели.
Привязка сайта произошла. Теперь когда пользователи кликают на кнопку «Подписаться», информация об этом будет отправляться в Яндекс.Метрику. Ее можно найти в разделе «Отчеты» — «Стандартные отчеты» — «Конверсии».
Алгоритм в этом случае был следующий:
- Создание тега, содержащего код Яндекс.Метрики.
- Создание второго тега с идентификатором и триггером, работающим в заданных условиях.
- Создание в Яндекс.Метрике цели с идентификатором, аналогичным тому, что был во втором теге.
Понимание принципа этих действий поможет вам самостоятельно проектировать и создавать цели на разных площадках.
