Как установить и настроить Google Tag Manager

Мануалы
6Нравится
Комментарии
Поделиться
Как установить и настроить Google Tag Manager

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

1. Для чего нужен Google Tag Manager?

Google Tag Manager

Google Tag Manager (GTM) используют для управления тегами — небольшими кусочками программного кода, которые позволяют собирать различные данные и делать анализ. Теги, настраиваемые в GTM, помогают упростить следующие процессы:

  1. Получение количества совершённых конверсий: добавления товаров в корзину, просмотров определённых страниц, кликов по баннерам, нажатий кнопок и т.д.
  2. Установка кодов Google Analytics и Яндекс.Метрики.
  3. Настройка ремаркетинга и таргетинга в поисковых системах и социальных сетях.
  4. Отслеживание переходов пользователей по внешним и внутренним ссылкам.
  5. Получение данных о скроллинге на сайте, ошибках и прочем.

Теги содержат обычно 10-20 строчек кода, которые автоматически добавляются на все страницы сайта. Например, фрагмент на скриншоте предназначен для отслеживания добавлений товаров в корзину.

Фрагмент для отслеживания добавлений товаров в корзину

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

Настроить новый аккаунт можно всего за несколько минут. Единственное, что нужно знать, — какие теги уже используются на проекте, чтобы переместить их в GTM. Вся работа может занять от часа до пары дней (если ресурс очень крупный, и на нём необходимо отслеживать множество параметров).

2. Google Tag Manager: настройка

2.1. Как создать аккаунт и контейнер

Контейнер — это набор правил, тегов и макросов. Вначале нужно зарегистрироваться в сервисе:

Как зарегистрироваться и добавить аккаунт в Google Tag Manager

  1. Нажмите «Создать аккаунт».

    Как зарегистрироваться и добавить аккаунт в Google Tag Manager

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

    Как добавить аккаунт в Google Tag Manager

  3. После принятия «Соглашения об условиях использования Диспетчера тегов» будет предложено скопировать сгенерированный код на страницы проекта.

    Как добавить аккаунт в Google Tag Manager

  4. Первый фрагмент добавьте в начале раздела <head>, а второй — после открывающего тега <body>. В WordPress можно вставить тег в меню «Внешний вид» — «Редактор тем» — «Заголовок».

    Как добавить фрагмент Google Tag Manager на сайт

  5. Вторую часть тега также вставьте в header.php сразу после <body>. Затем нажмите на «Обновить файл».

    Как добавить фрагмент Google Tag Manager на сайт

2.2. Как добавить контейнер в существующий аккаунт

После создания аккаунта в него можно добавлять новые контейнеры. Создание контейнеров доступно на вкладке «Администрирование».

Как добавить контейнер в существующий аккаунт Google Tag Manager

Для добавления нового контейнера нажмите плюс:

Как добавить контейнер в существующий аккаунт Google Tag Manager

Укажите сведения о контейнере — название и тип. Затем выберите «Создать».

Как добавить контейнер в существующий аккаунт Google Tag Manager


После этого в аккаунт будет добавлен новый контейнер.

2.3. Как создать тег в GTM

Покажу на примере настройки Google Analytics через Tag Manager. Она проводится в три этапа: для новых проектов нужно сначала создать аккаунт Google Analytics, потом переменную с номером идентификатора, а затем — тег отслеживания. Если аккаунт уже создан, нужно только скопировать уникальный идентификатор, который отображается в разделе «Код отслеживания». Если аккаунта ещё нет, выполните следующие действия:

  1. Перейдите в Google Analytics и нажмите «Создать аккаунт».

     Как создать тег в Google Tag Manager

  2. Укажите название аккаунта и нажмите «Далее».

     Как создать тег в Google Tag Manager

  3. Выберите тип ресурса «Веб».

     Как создать тег в Google Tag Manager

  4. После этого заполните четыре поля:
    • имя сайта,
    • URL-адрес ресурса,
    • отрасль,
    • часовой пояс.
  5. После внесения сведений нажмите на «Создать».

     Как создать тег в Google Tag Manager

  6. Затем отобразится идентификатор отслеживания, который нужно использовать в GTM. Скопируйте его значение.

     Как создать тег в Google Tag Manager

  7. Вернитесь в Диспетчер тегов. Выберите в текущей рабочей области вкладку «Переменные».

     Как создать тег в Google Tag Manager

  8. Нажмите на кнопку «Создать».

     Как создать тег в Google Tag Manager

  9. Внесите имя переменной (например, «Google Analytics») и укажите её вид — «Константа».

     Как создать тег в Google Tag Manager

    В качестве значения константы укажите скопированный идентификатор и сохраните данные.

     Как создать тег в Google Tag Manager

  10. Создайте тег в соответствующем разделе рабочей области.

     Как создать тег в Google Tag Manager

  11. Введите имя тега и укажите его тип — «Google Аналитика».

     Как создать тег в Google Tag Manager

  12. Переопределите настройки тега и укажите созданную переменную Google Analytics.

     Как создать тег в Google Tag Manager

  13. Укажите триггер активации — «All pages» и сохраните внесённые изменения.

     Как создать тег в Google Tag Manager

  14. Для активации тега отслеживания Аналитики выберите «Отправить.

     Как создать тег в Google Tag Manager

  15. Опубликуйте тег.

     Как опубликовать тег в Google Tag Manager

  16. Внесите название версии контейнера и его краткое описание, для удобства можно использовать в качестве имени дату внесённых изменений, потом нажмите на кнопку «Далее».

     Как опубликовать тег в Google Tag Manager


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

2.4. Как настроить триггеры GTM

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

Как настроить триггеры в Google Tag Manager

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

  1. Задайте ему имя и выберите тип «Отправка формы».

     Как настроить триггеры в Google Tag Manager

  2. Далее укажите условие активации — «Все формы» и нажмите «Сохранить»:

     Как настроить триггеры в Google Tag Manager

Для триггеров можно также настраивать конкретные условия активации, используя фильтры. Например, указать, что отслеживаться должна только отправка формы с определённым ID:

Как настраивать конкретные условия активации через фильтры в Google Tag Manager

Узнать детальную информацию о всех типах триггеров и их настройках можно в Справке Google.

2.5. Как использовать переменные GTM

Переменные GTM применяются в тегах и триггерах. В триггерах они используются для настройки фильтров, чтобы указать конкретное условие запуска. Например, создать переменную с URL-адресом какой-либо важной страницы для отслеживания её просмотров. В тегах переменные используют, чтобы получать динамические значения, к примеру, идентификаторы заказа и товаров.

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

Как использовать переменные Google Tag Manager

3. Что делать, если Google Tag Manager не работает

Проблемы с GTM могут возникнуть по различным причинам:

  1. Контейнер ещё не опубликован. Убедитесь, что не забыли сохранить все изменения и опубликовать их. Если изменения вносились совсем недавно, возможно, система ещё не успела их обработать.
  2. Некорректная настройка триггеров. Возможно, установлены слишком строгие условия активации тегов или допущены ошибки в конфигурации.
  3. Неполадки в работе триггеров из-за изменения кода проекта. Часть триггеров зависит от наличия на страницах идентификаторов HTML и атрибутов class. Для устранения такой проблемы следует использовать уровень данных — объект JS, через который сведения с ресурса передаются в контейнер GTM.
  4. Избыточное количество HTTP-запросов. Как правило, браузеры могут в один момент времени обрабатывать до восьми запросов с каждого домена. Если этот лимит превышен, могут возникать сбои в работе GTM.
  5. Некорректная установка менеджера. Проверить её корректность можно с помощью расширения Google Chrome Tag Assistant.
  6. В некоторых случаях пользователи могут слишком быстро уходить с ресурса, и тег не будет вовремя активироваться. Во избежание таких проблем необходимо чётко следовать инструкциям по установке тегов.

Если не получилось выявить и устранить причину сбоя работы GTM, следует восстановить предыдущую исправную версию:

Как восстановить исправную версию Google Tag Manager

Для восстановления найдите в меню пункт «Выбрать в качестве последней версии»:

Как восстановить исправную версию Google Tag Manager

Подводим итоги

  1. Диспетчер тегов Google помогает отслеживать разнообразные действия и события на проекте — просмотры страниц и видео, скроллинг и отправку форм, нажатие на кнопки и переходы по внешним или внутренним ссылкам.
  2. Использование GTM экономит время, снижает риск ошибок и позволяет настраивать отслеживание без знания программирования и привлечения сторонних специалистов.
  3. В GTM используются теги, триггеры активации и переменные, есть множество встроенных вариантов, а также доступно создание пользовательских элементов.
  4. Анализ полученной информации позволит узнать уязвимые места проекта и понять, какие именно следует предпринять шаги по его усовершенствованию.