что такое gtm в маркетинге
Что такое Google Tag Manager и как им пользоваться
Учимся работать с популярным диспетчером тегов: пошаговая иллюстрированная инструкция по настройке Google Tag Manager.
Что такое Google Tag Manager
Google Tag Manager — это простой, надежный и бесплатный диспетчер тегов. С помощью него можно создавать и обновлять теги для сайта или мобильного приложения, проще использовать код сторонних служб, самостоятельно управлять тегами и заниматься тестированием и отладкой.
Зачем нужен Google Tag Manager (GTM)
С помощью GTM на сайт можно добавить код разных служб аналитики: Google Analytics, «Яндекс.Метрики», Google Maps и других сервисов для мониторинга сайта.
Преимущества GTM
Термины Google Tag Manager
Оболочка для хранения всех тегов вашего сайта или мобильного приложения. По сути, контейнер — основной код, который добавляется на сайт и отвечает за запуск тегов сторонних сервисов. Для каждого ресурса — свой контейнер.
Фрагмент кода JS, который необходимо выполнить и к которому можно подключить триггер. У тега много разных функций: отслеживание трафика и поведение посетителей, анализ эффективности рекламы, ремаркетинг и таргетинг.
Условие для выполнения или блокировки тега. Триггер должен содержать какое-то событие: загрузка страницы, переход по ссылке, клик и так далее. Также для триггера есть фильтры, которые можно настроить. Например, указать URL страниц, на которых должен срабатывать тег.
Параметр, для которого передается значение в процессе работы.
Настройка Google Tag Manager
Перейдите на сайт Google Tag Manager и авторизуйтесь с помощью
Google-аккаунта. Если аккаунта нет, создайте и затем авторизуйтесь.
После авторизации создайте аккаунт для GTM или выберите из уже созданных. Я покажу настройку GTM на своем небольшом тестовом сайте sokratzona.info.
В открывшемся окне добавления нового аккаунта введите его название. Нажмите кнопку Далее.
Для создания контейнера введите его название и укажите, где он будет использоваться. Я выбрал веб-сайт. Нажмите кнопку Создать.
Скопируйте код контейнера.
Если вы случайно закрыли окно с кодом и не скопировали его, ничего страшного, найти его можно, нажав на идентификатор контейнера в правом верхнем углу.
Нажмите на идентификатор, и у вас появится окошко с кодом. Скопируйте его и разместите на своем сайте.
В моем случае файл, куда я поместил код, называется index.html. Если вы используете CMS, возможно что файл будет называться header.php или еще как-то.
Как создать тег в Google Tag Manager
Давайте подключим сайт к Google Analytics. В рабочей области в карточке Новый тег нажмите на ссылку Добавить новый тег.
Далее перейдите в Конфигурацию тега и выберите его тип. Например, Google Аналитика — Universal Analytics.
Укажите идентификатор отслеживания. Найти его можно в аккаунте Google Analytics, Администратор — Настройки ресурса — Идентификатор отслеживания.
В качестве типа отслеживания выберите Просмотр страницы. В категории Триггеры выберите All Pages. Сохраните изменения.
Теперь проверим, правильно ли мы все подключили. Для этого нужно опубликовать контейнер. Перед публикацией рекомендую сделать предпросмотр в режиме отладки, чтобы в случае необходимости все быстро исправить, не затрагивая боевую версию сайта.
Сайт откроется в том же браузере. Если у вас внизу на панели отладки появился тег, то вы все сделали правильно.
Проверьте корректность работы Google Analytics. Да, все работает.
Как настроить и использовать триггеры GTM
Триггеры находятся в меню рабочей области GTM.
Выберите тип триггера.
Выбрав тип триггера, настройте условие его активации: укажите тип переменной Click URL и ссылку, переходы по которой будете отслеживать.
Как использовать переменные GTM
Чтобы задействовать переменные, выберите соответствующий пункт в меню рабочей области GTM.
Можно настраивать встроенные шаблоны переменных или создавать пользовательские.
В этом окне вы можете ознакомиться с доступными типами встроенных переменных. После того, как отметите переменную, она станет доступной в фильтре триггера.
Какие задачи можно решить с помощью Google Tag Manager
1. Отслеживать клики по кнопкам соцсетей
Создайте тег Пользовательский HTML и скопируйте код кнопок шеринга сервиса, которым вы пользуетесь.
Укажите триггер All Pages. Сохраните и опубликуйте контейнер. Триггер можно указать как для всех страниц, так и выборочно.
Вот, что получилось после публикации:
2. Внедрять микроразметку
Так же, как и в предыдущем примере, сгенерируйте код с помощью сервиса Schema или любого другого. Создайте тег Пользовательский HTML и разместите туда полученный код, настройте активацию триггера. Вот так настраивается микроразметка.
3. Отслеживать переходы по внешним ссылкам
Создайте новый тег. Тип тега выберите Universal Analytics.
Настройте конфигурацию тега.
Настройте триггер. Выберите тип Только ссылки, отметьте пункт Некоторые ссылки и назначьте событие активации триггера.
Сохраните и опубликуйте ваш тег, но прежде проверьте, активирован ли он. Для этого нажмите на предварительный просмотр и кликните по любой внешней ссылке.
Посмотрите в Google Analytics вкладку события в режиме реального времени.
4. Просматривать показатель отказов
Любое посещение сайта без совершения целевых действий Google Analytics считает отказом. Например, вы просмотрели одну страницу, не зарегистрировались или не подписались на рассылку, не заказали услугу, не связались посредством формы обратной связи и не поделились контентом — это и есть отказ.
Даже если по итогу вы позвонили по указанному на сайте телефону, а не через кнопку обратного звонка, и купили товар, все равно Google Analytics учтет вас как «отказника». Такое состояние дел несколько искажает действительность и не дает реальной картины.
Для уточнения показателя отказов и получения более точных сведений можно настроить отслеживание длительности посещения без привязки к действиям. Пробыли на сайте десять секунд — уже не отказ.
Чтобы настроить показатель отказов, создайте тег Universal Analytics, тип отслеживания Событие.
Затем укажите для тега триггер Таймер и задайте нужный интервал в миллисекундах.
Проверьте подключение тега.
В Google Analytics показатель уменьшился.
Заключение
Знание таких инструментов, как GTM, пригодится каждому маркетологу. К сожалению, нередко бывают ошибки, которые влекут за собой дополнительные расходы, а неверно собранные данные искажают результаты. Поэтому всегда важен комплексный подход и умение правильно работать с данными аналитики.
На курсе Skillbox вы сможете углубить свои знания в веб-аналитике, рассмотрите множество реальных кейсов и познакомитесь со всеми инструментами сбора, обработки и визуализации информации, которые можно использовать на практике.
Автор статей по дизайну. В веб-дизайн пришел в 2013 году, осознанно начал заниматься с 2015 года. Параллельно освоил верстку. Время от времени публикую переводы на хабре.
Google Tag Manager: что это, как его настроить и какие задачи можно решить при помощи тегов
Что такое Google Tag Manager
Сервис представляет собой диспетчер тегов Google, с помощью которых удобно управлять JavaScript и HTML тегами (фрагментами кода) без помощи разработчиков. Его подключение позволит меньше времени тратить на работу с кодами.
Обойтись без сервиса можно, если рекламная кампания проводится на одной-двух площадках и все коды отрабатываются вручную. Однако если количество рабочих площадок больше, Tag Manager может оптимизировать процесс работы и сократить время на обработку данных.
Функционал подключит новые коды других служб через соответствующие инструменты. Диспетчер работает с кодами многих сервисов: от тех, что принадлежат непосредственно Google до сторонних сайтов. Например, Google Tag Manager работает с кодами Яндекс.Метрики, Google Analytics, Google Maps, Liveinternet и прочих аналитических сервисов.
Зачем нужен Google Tag Manager
Сервис помогает составить полный статистический отчет по проведенной рекламной кампании, который ответит на следующие вопросы:
Аналитика поможет скорректировать состояние текущих проектов, продемонстрирует преимущества и недостатки выбранной стратегии.
Термины и структура GTM
Диспетчер тегов, как и любой профильный инструмент, имеет собственную терминологию, которой пользуются специалисты. Рассмотрим наиболее распространенные среди них:
Это оболочка, хранящая все теги сайта или приложения. Под контейнером подразумевается основной код, добавляемый в GTM и запускающий другие теги сервиса. Каждая площадка имеет свой контейнер с расположенной в нем информацией.
Это фрагмент кода JS, к которому подсоединяется триггер. Теги имеют несколько задач: отслеживают входящий трафик и поведение пользователей на сайте, анализируют эффективность рекламной стратегии, отвечают за ремаркетинг и настройку таргетинга.
Это определенное условие, связанное с работой тега. Тег может реализовывать свою задачу или блокироваться. В основе триггера лежит действие пользователя, называемое событием: клик по объявлению, переход по ссылке или загрузка страницы. Для каждого триггера можно настроить специальные фильтры, например, прописать адрес страницы, где тег должен работать.
Параметр, значение которого передается в процессе работы. Например, если необходимо отслеживать посещение определенной страницы, можно настроить триггер «Просмотр страницы». Он будет работать, если переменная Page URL примет значение заданной страницы. В тегах переменные используются для хранения и передачи данных о действиях пользователей на сайте, транзакциях, товарах и т. д.
Сервис предоставляет готовые шаблоны и дает возможность создавать свои переменные или теги.
Макросы
Google Tag Manager имеет макросы, позволяющие задать условия срабатывания тега. Макросами называют пары «имя–значение», использующиеся для создания и регулировки правил. Обычно команда нацелена на режим выполнения. Это значит, что настройка определенной страницы происходит в реальном времени для каждого посетителя сайта или приложения.
Также макросы GTM являются парой, которая отправляет значение в процессе работы диспетчера тегов. Это можно проследить на примере следующей схемы. Контейнер страницы имеет исходный код, который просматривается через диспетчер тегов. В личном кабинете можно изменить и активировать теги контейнера с определенными правилами работы. Макросы помогают настраивать правила активации меток, чтобы теги исправно работали на сайте.
Диспетчер имеет встроенные, готовые макросы, а также позволяет пользователям создавать свои. У шаблонных значений несколько разновидностей.
URL-макрос
Этот вид отличается тем, что URL может быть и именем, и значением, на него не влияет верхняя граница. При его работе страницы отображают коды метрик и AdWords. Макрос оптимизирует их действие и упрощает работу с данными.
HTTP Referrer-макрос
Макрос – имя, значение – страница, откуда пришел посетитель. Он помогает задавать значение переменной GA, настраиваемой пользователем.
Event-макрос
Это сложный элемент, особенно если раньше работа происходила с событием. События применяются для отслеживания действий посетителей на сайте в момент полной загрузки страницы. Когда пользователь открывает и заполняет форму регистрации на сайте, это позволяет создать соответствующее событие. Если при этом есть определенные правила, находящиеся в прямой зависимости от события, активируется специальный тег. Например, это срабатывает, если нужно сделать событие, срабатывающее после заполнения формы заказа.
Пользовательские макросы
Когда область задач требует нестандартных решений, диспетчер тегов Google Tag Manager дает возможность ввести собственные разработки. Пользовательские макросы используют для создания правил. Наиболее популярные среди них:
Элемент имеет ограничения в применении. Он полезен в случаях, когда вы хотите установить стандартное название компании, которое должно определяться в качестве постоянной строки. Это облегчает обновление строки в диспетчере и демонстрирует ее во всех остальных тегах.
На базе JS будет отображаться значение и содержимое страницы. Создание макросов позволяет устанавливать собственные правила для тегов, которые будут привлекать больше внимания, чем при стандартном интерфейсе.
Это понятие включает сбор сведений со страницы и их расположение в удобном для пользователя формате. Стандартно сведения разбросаны по странице, в то время как DataLayer собирает информацию в исходном коде, подбирая пары в формате «имя-значение».
Преимущества и недостатки
Google Tag Manager имеет ряд преимуществ, привлекающих внимание пользователей:
Среди недостатков можно выделить:
Настройка Google Tag Manager
Чтобы использовать диспетчер тегов, добавьте на сайт контейнер, используйте переменные, настройте триггеры и добавьте в контейнер теги. Рассмотрим инструкцию подробнее.
Как добавить на сайт контейнер диспетчера тегов
Для работы с GTM необходим аккаунт Google. Если аккаунт уже есть, выберите раздел «Sign in to Tag Manager» и создайте учетную запись для диспетчера тегов. Введите название нового аккаунта, затем название контейнера и укажите тип ресурса, где будет осуществляться деятельность компании: сайт или мобильное приложение на базе IOS/Android.
После регистрации вы получите специальный код, который нужно скопировать и разместить на страницах своего сайта.
Также контейнер можно добавить в уже имеющийся аккаунт. Для этого зайдите в сервис, затем в «Аккаунты» и выберете название нужного профиля. Затем «Создание контейнера», введите его имя и используемый ресурс.
Как использовать переменные Google Tag Manager
Теги начинают работать, если триггер совпадает по значению с используемой переменной. Чтобы управлять настройками переменных, нужно выбрать соответствующий раздел из меню «Переменные».
В доступе есть шаблонные переменные и возможность создавать собственные под особые запросы. Встроенные варианты:
Как только переменная начинает использоваться, она появляется на рабочей панели и связывается с соответствующим триггером.
Как использовать триггеры Google Tag Manager
Триггер – условие активации тега. Для настройки триггера необходимо перейти в меню и выбрать «Создать» в специальном разделе. GTM по умолчанию включает такие триггеры как:
Активируется триггер с подбором переменной, которая будет соответствовать его значению.
Как настроить и проверить работоспособность тегов в GTM
Для отслеживания событий, подключения внешних служб необходимы теги, которые размещаются в контейнере. У Google Tag Manager десятки встроенных тегов, работающих с аналитическими системами. Для их подключения сайт должен уже быть присоединен к Google Analytics. Далее выполнить действия:
Проверить работу тега можно в режиме предварительного просмотра и отладки.
Как установить системы аналитики РС через Google Tag Manager
После необходимо проверить, как функционирует диспетчер уже на сайте. Для этого подойдет режим предварительного просмотра или специальные расширения Google Tag Assistant. На сайте должна подгрузиться iframe-форма. Когда сервис начнет работу, можно подключать аналитические счетчики.
Установка Google Analytics
Корректность продленной работы можно оценить в режиме предпросмотра или с помощью самого Google Analytics, выбрав «Отчет в реальном времени».
Установка Яндекс.Метрики
Для подключения сервиса Яндекс.Метрики следующий порядок действий:
Установка Facebook Pixel
Добавить пиксель Facebook можно автоматически с помощью специальной интеграции или самостоятельно. При ручной установке нужно проделать то же, что и с сервисом Яндекс: создать тег, выбрать «Пользовательский HTML» и после перенести код. Если делать это автоматически, то достаточно отыскать Facebook Pixel в числе партнерских программ Google Tag Manager.
Подтверждением операции станет появившийся тег пикселя на соответствующей панели в рабочей области.
Возможные проблемы при работе с Google Tag Manager
Среди потенциальных проблем можно выделить следующие:
Заключение
Работа с Google Tag Manager позволяет быстро и эффективно проводить веб-аналитику без особых затрат. Автоматические механизмы помогают настраивать рекламную кампанию, собирать информацию и делать актуальные презентации собственных продуктов. У сервиса есть интеграции со многими аналитическими системами, благодаря чему их можно легко подключить и оперативно вносить изменения.
Как использовать Google Tag Manager
Google Analytics и Яндекс.Метрика давно стали необходимыми инструментами для любого сайта. Чтобы воспользоваться такими сервисами, достаточно добавить их код на свой ресурс. Это несложно, но здесь могут возникнуть некоторые трудности – обычно они начинаются в тех случаях, когда требуется внести изменения в уже добавленный код. Для начинающего вебмастера сделать это довольно проблематично – чуть что заденешь, и весь сайт полетит. Выходом из ситуации может стать специальный сервис от Google – Tag Manager.
Давайте разберемся, что умеет этот инструмент и как им воспользоваться.
Что такое Google Tag Manager
Google Tag Manager (Диспетчер тегов) – это специальный сервис, благодаря которому можно упростить использование кода сторонних служб на веб-сайтах или в приложениях. Другими словами, это целая система, позволяющая без помощи программиста настраивать и пользоваться популярными службами аналитики. Специалист может потребоваться только на начальном этапе, когда будет нужно внедрить код диспетчера тегов. В последующем все действия для подключения различных сервисов будут выполняться вами самостоятельно.
Стоит также понимать, что GTM – это не единственный сервис в своем роде, существуют такие системы, как Tealium, Adobe Dynamic Tag Manager, Yahoo Tag Manager. Но почему же все выбирают Google? Рассмотрим далее.
Почему Google Tag Manager
Обычно выделяют следующие преимущества сервиса:
Несмотря на это, вы можете обойтись и без Google Tag Manager, но только в тех случаях, когда используете до двух сторонних служб. В противном случае инструмент сильно упростит контроль над множеством сервисов.
Настройка Google Tag Manager
Первое, что от нас потребуется, – это пройти регистрацию и разместить код контейнера на своем сайте. Давайте быстренько сделаем это, а затем уже перейдем к основным настройкам. Так сказать, будем знакомиться по ходу дела.
В данном случае файл, в котором был прописан код, называется index.html. Также он может именоваться как header.php или как-то иначе, если сайт расположен на CMS.
Основные параметры
Прежде чем переходить к настройкам сервиса, давайте остановимся на некоторых понятиях, относящихся к GTM. Это контейнер, тег, триггер и переменная – именно они нас встречают на главной странице сервиса.
Объясняю на пальцах: в каждом аккаунте есть как минимум один контейнер. В нем располагается один или несколько тегов – например, код Google Analytics. Для него устанавливается триггер, который определяет условия срабатывания тега и отправки им данных. После того как триггер срабатывает, он считывает определенную переменную. Например, встроенная переменная Click Text содержит текст, а Click URL — URL. Данный триггер активируется, если значение переменной совпадает с заданными пользователем параметрами: кликом по элементу с указанным текстом или URL.
Именно с переменных и начинается базовая настройка Google Tag Manager.
Настройка переменных
Все переменные в Google Tag Manager разделяются на два типа: встроенные и пользовательские. Сейчас нам достаточно будет встроенных значений, но в последующем вы можете настроить свои переменные.
Процесс настройки довольно прост. По умолчанию у нас уже установлены некоторые переменные, готовые к работе – посмотреть их можно в разделе «Переменные».
В отобразившемся окне мы видим встроенные и пользовательские переменные. По умолчанию список вторых пуст. Чтобы его заполнить, необходимо нажать на кнопку «Создать», в результате чего отобразится дополнительный блок с возможными конфигурациями для настройки. Со встроенным переменными все намного проще – не нужно ничего создавать, можно просто добавить необходимую переменную, и все будет работать автоматически.
Пройдемся по каждому типу встроенных переменных:
Для того чтобы добавить новую переменную, достаточно отметить ее в меню конфигуратора, после чего она автоматически отобразится в рабочей области.
Настройка триггеров
Для начала давайте рассмотрим основные параметры триггеров, а затем перейдем к их настройке. Всего их 4 типа:
Просмотр страницы
Клик
Взаимодействия пользователей
Другое
Вот такой функционал поддерживают триггеры. Давайте создадим один триггер, который будет взаимодействовать с переменной. Для этого выполним следующее:
Готово! Мы создали свой первый триггер. При необходимости вы можете настроить более точное срабатывание с помощью дополнительных параметров.
Настройка тегов
Вот мы и пришли к самому интересному: после того как переменные были определены, а триггеры настроены, можно переходить к тегам. Их настройка начинается в разделе «Теги» с помощью кнопки «Создать».
В меню конфигуратора мы увидим два блока «Конфигурация тега» и «Триггеры». Первым делом нам понадобится верхний раздел – перейдем в него и посмотрим, что там находится.
Здесь мы можем выбрать один из тегов, который соответствует нужному нам сервису. Пусть это будет «Google Аналитика: Universal Analitics».
После этого перед нами отобразится окно настроек выбранного тега. Так как мы хотим использовать Google Analytics, потребуется добавить идентификатор отслеживания. Чтобы это сделать, отмечаем пункт «Включить переопределение настроек в этом теге» и вводим значение.
Теперь нам нужно привязать к этому тегу триггер – для этого на этой же странице открываем блок «Триггеры» и выбираем тип отслеживания просмотра страниц «All Pages». В данном случае мы используем триггер, который был автоматически сгенерирован сервисом. Если вы ранее создавали собственный тег, то можете добавить его, но только в том случае, если он подходит под данное действие.
В завершение сохраняем созданный нами тег.
Готово! Тег был создан, теперь давайте проверим его работоспособность – для этого в Google Tag Manager есть специальная функция «Предварительный просмотр».
На отобразившейся странице вводим ссылку на свой сайт и жмем «Start».
После этого будет выполнен переход на сайт. Если на панели отладки появится тег, то поздравляю. Все получилось!
Осталось опубликовать контейнер с созданным тегом. Для этого на главной странице выбираем «Отправить».
На этом настройка Google Tag Manager завершена. Как только вы нажмете на кнопку «Отправить», перед вами отобразится новое окно, в котором можно указать название версии и ее описание. После внесения изменений останется нажать на кнопку «Опубликовать».
Теперь вы знаете, как можно использовать Google Tag Manager. Спасибо за внимание!