Хотите быстрее научиться создавать сайты? Рекомендую эти видеокурсы!

х
Наверх

Как работать с Google Tag Manager?

Содержание:

Google Tag Manager является диспетчером тегов. Благодаря данному сервису можно легко использовать код сторонних служб на веб-сайтах, а также в приложениях. Его достаточно добавить один раз на сайт контейнер или мастер-код, чтобы впоследствии можно было добавлять код других служб через интерфейс диспетчера. При помощи Google Tag Manager можно настраивать ретаргетинг, авторассылку, аналитику, A/B тесты, а также другие функции используя скрипты.   

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

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

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

Для начала необходимо перейти на сайт google.com/tag-manager и пройти регистрацию. Вы сможете использовать сервис только если будете авторизованы. Далее нажмите на вкладку «Start for free».

сервис Google Tag ManagerПосле этого создайте «Создать аккаунт».

создание аккаунта в Google Tag ManagerЗатем введите необходимые параметры.

создание аккаунта в Google Tag ManagerВажно правильно указать целевую платформу, а именно для каких целей будет использоваться сервис (приложение или сайт). После того как все данные будут внесены нажмите на вкладку «Создать».

выбор целевой платформы в Google Tag ManagerВ результате вы перейдете на свой личный аккаунт. Перед вами сразу отобразится небольшое окно с кодом, который необходимо скопировать и вставить на свой сайт. Если вы используете для управления ресурсом CMS WordPress, то для вставки кода воспользуйтесь специальными плагинами. Код состоит из двух частей. Первую необходимо вставить в хадер, как можно ближе к открывающемуся тегу. Второй код вставляется в тело страницы, после тега <body>.

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

уникальный код в Google Tag Manager

Основные параметры Google Tag Manager

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

Контейнер – оболочка для хранения всех тегов сайта или приложения. Основная составляющая контейнера – код, который применяется для активации тегов сторонних ресурсов.

Тег – часть кода JavaScript. Выполняя эту часть кода отслеживается трафик и поведение посетителей. Также при помощи данной операции можно проанализировать эффективность рекламы, таргетинга или ремаркетинга.

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

Переменная – параметры для отслеживания определенных значений.

Как настроить переменные?

Переменные в Google Tag Manager имеют два типа – встроенные и пользовательские. Встроенные значения – это переменные которые доступны по умолчанию. Они готовые к работе и их можно просмотреть в данном разделе. Пользовательские это те, которые можно настроить самостоятельно.

Рассмотрим какие есть встроенные переменные. Для этого перейдите в раздел «Переменные» в левой части интерфейса и нажмите на вкладку «Настроить».

раздел переменные в Google Tag ManagerСправа откроется «Конфигурация встроенных переменных».

Конфигурация встроенных переменных в Google Tag ManagerОна разделяется на несколько типов:

  • Страницы. Здесь в качестве переменной можно выбрать полный URL (Page URL), относительный URL (Page Path), а также имя хоста страницы (Page Hostname), источник запроса (Page Referrer);
  • Утилиты. Данный вид состоит из события, ID и версией контейнера, с названием рабочей области и ID HTML-тега;
  • Ошибки. При помощи таких переменных можно просматривать контейнер в режиме настройки. Кроме того, при возникновении ошибки вы можете отправить ее номер или URL, где она зафиксирована;
  • Клики. В данном случае в качестве переменных можно задействовать HTML-элементы, а также классы элементов, их текст и атрибуты target и ID элемента;
  • Формы. В этих параметрах используются текст, классы и элементы формы, а также атрибуты target и href;
  • История. При изменении хеша URL, этот тип переменных поддерживает активацию триггера. Вам будет доступен новый и старый фрагмент URL и состояние истории.

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

Как настроить триггеры?

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

настройка триггеров в Google Tag ManagerПосле этого в правой части появятся варианты выбора типа триггера. 

выбор типа триггеров в Google Tag ManagerЗдесь вам будет доступен выбор просмотра страницы. Как привило, просмотр может фиксироваться при ее полной загрузке, или во время загрузки. При выборе клика, фиксироваться будут действия по всем кликабельным элементам ресурса. Настройка взаимодействия пользователей будет срабатывать при просмотре видео на YouTube, а также отслеживании по ID элемента либо CSS-селектору. Кроме того, раздел взаимодействия пользователей дает возможность определять скролл страницы во время вертикальной или горизонтальной прокрутки, а также позволяет настраивать триггер на отправку форм.

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

Давайте для примера создадим триггер «Только ссылки» в пункте «Клик».

создание триггера в Google Tag ManagerДалее вам необходимо обозначить условия активации.

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

Пункт «Проверка ошибок» позволяет активировать теги только в том случае, если переход по ссылке осуществлялся допустимым методом. При отсутствии флажка под этим пунктом активация тегов будет происходить только когда пользователь кликнет по ссылке.

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

Как настроить теги?

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

создание тегов в Google Tag ManagerПосле этого откроется меню конфигурации, в котором будет два блока. Для начала необходимо перейти в первый блок - «Конфигурация тега».    

конфигурация тега в Google Tag ManagerКогда вы перейдете в этот блок, то увидите список тегов, соответствующих необходимому вам сервису. Для примера выберем «Google Аналитика: Universal Analitics».

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

тег Google Analytics в сервисе Google Tag ManagerТеперь необходимо привязать триггер к данному тегу. Для этого необходимо перейти по вкладки «Тригерры», которая находится ниже, и в открывшемся окне кликнуть на «All Pages» - тип отслеживания просмотра страниц. В этом случае выбирается автоматически подобранный сервисом триггер. Если вы создавали триггеры ранее, то они также появятся в этом списке. Вы можете выбрать их, если действие подходит в данной ситуации.

настройка триггера в Google Tag ManagerВ завершении необходимо сохранить тег, который вы создали. Для публикации контейнера с созданным тегом, необходимо нажать на синюю вкладку «Отправить», располагающуюся в правом верхнем углу.

публикация контейнера в Google Tag ManagerСразу после отправки тега настройка Google Tag Manager завершится. Как только вы отправите тег, появится новое окно, в котором вы можете ввести название версии и описание. Когда вы внесете все изменения, нажмите на вкладку «Опубликовать».  

Какие задачи решаются при помощи Google Tag Manager?

Добавление кнопки шеринга на изображения

Эта функция позволяет мгновенно интегрировать сайт со сторонними сервисами. Для этого необходимо перейти в раздел «Теги», создать новый тег и выбрать тип «Пользовательский HTML».

тип тега «Пользовательский HTML» в Google Tag ManagerДалее скопируйте код кнопок шеринга сервиса и вставьте в окно. Для активации выберите вариант триггера All Pages. Затем сохраните изменения и опубликуйте контейнер при помощи вкладки «Отправить».

код кнопок шеринга сервиса в Google Tag ManagerОтслеживание внутренних переходов на сайте

Google Tag Manager позволяет использовать события в Google Analytics для мониторинга переходов. Например, ваша цель заключается в отслеживании переходов по конкретной ссылке. Для этого перейдите в раздел «Переменные» и нажмите на вкладку «Настроить». В списке конфигураций встроенных переменных выберите Click URL.

конфигурация встроенных переменных Click URL в Google Tag ManagerДалее перейдите в раздел «триггеры» и выберите тип «Только ссылки». 

триггер "только ссылки" в Google Tag ManagerСледующее окно – настройка триггера. Здесь необходимо поставить галочку под пунктом «Ждать теги». Автоматически выставится время 2000 мс. Его можно изменить. Ниже необходимо указать URL целевой страницы, а также выбрать функцию «Все клики по ссылкам».  

настройка триггера в Google Tag ManagerТеперь вы можете использовать данный триггер. В разделе «Теги» создайте новый тип Universal Analytics, а к его триггеру добавьте тот, который вы только что создали. При настройке конфигурации необходимо заполнить «Тип отслеживания», «Категория», «Действие», «Ярлык». Когда вы запустите публикацию контейнера в разделе Google Analytics вам будут доступны данные аналитики в «Событиях».  

Отслеживание переходов по внешним ссылкам 

Здесь имеется ввиду аналитика всех кликов по любым внешним ссылкам выбранного сайта. Для этого перейдите в раздел «Переменные» и создайте тип переменной «URL». При настройке конфигурации переменной выберите компонент «Имя хоста», а также функцию «Убрать www». В дополнительных настройках выберите в поле «Источник URL» вариант «Click URL».

Источник URL» тип «Click URL в Google Tag ManagerПосле этого создайте триггер типа «Клик – Все элементы». Необходимо выбрать пункт «Некоторые клики» в условиях активации. В фильтрах указывается, что активация триггера происходит только если имя хоста не содержит URL вашего сайта. После этого сохраните триггер.  

тип триггера "Клик – Все элементы" в Google Tag ManagerДалее создайте тег активации триггера при помощи выбора типа «Universal Analytics». Поля «Категория», «Действие», и «Ярлык» необходимо заполнить, указав название созданного ранее триггера «Все элементы». Затем опубликуйте тег в контейнере.

тип активации триггера «Universal Analytics» в Google Tag ManagerОтслеживание переходов по конкретной внешней ссылке

Для этой цели необходимо создать переменную типа «URL». В поле «Тип компонента» выберите «Полный URL». В «Источнике URL» выберите вариант «Click URL».

переменная типа «URL» в Google Tag ManagerИ пользуйте значение «Некоторые ссылки» в условиях активации. В настройках необходимо указать, чтобы триггер активировался только при переходе по конкретному URL. Сохраните этот триггер, а также тег Universal Analytics с его публикацией в контейнере.

Анализ показателей отказов

С Google Tag Manager данный показатель определяется более точно, чем просто в Google Analytics. Для этого необходимо создать новый триггер выбрав в разделе «Другое» тип «Таймер». В поле интервал необходимо ввести количество миллисекунд между активациями событий. Далее выберите максимальное количество активаций событий в поле «Ограничение». В условиях укажите вариант «Page URL» и страницу на которой должен срабатывать таймер.  

тип триггера "Таймер" в Google Tag Manager После этого создайте и опубликуйте новый тег Universal Analytics в контейнере. Таким образом, если посетитель провел на странице более 30 секунд, то таймер будет срабатывать автоматически. Это даст вам возможность просматривать более точные показатели отказов в Google Analytics. Отказом считается если пользователь присмотрел всего одну страницу и покинул сайт. Однако если пользователь просматривал одну страницу более 30 секунд, то это не считается отказом. 

Отслеживание взаимодействия пользователей с контактными формами

Если вы используете контактные формы на своем сайте, то при помощи Google Tag Manager их заполнение можно отслеживать. Чтобы воспользоваться данной функцией перейдите в раздел «Переменные» и нажмите на вкладку «Настроить». В конфигурациях в разделе «Формы» выберите «Form Classes».

отслеживание взаимодействия с формами через Google Tag ManagerЗатем создайте триггер и укажите его тип «Отправка форм» в разделе «Взаимодействие пользователей».

отправка форм в Google Tag ManagerВо время настройки триггера выберите вариант «Некоторые формы». В качестве условия активации используйте фильтр «Form Classes» и укажите значение атрибута class формы.

фильтр «Form Classes» в триггерах сервиса Google Tag ManagerПосле этого создайте соответствующий тег Universal Analytics и опубликуйте контейнер после его сохранения. Значение атрибута class формы просматривается в коде страницы.

Значение атрибута class формы в коде страницы Отслеживание переходов по тексту клика

В данном сервисе есть функция проверки эффективности CTR элементов, которые вы используете в своем ресурсе. Допустим на вашем сайте есть насколько кнопок с призывами к действию. Активируйте переменную «Click Text» чтобы выявить, какие кнопки нажимаются чаще всего.

отслеживание переходов по тексту клика в Google Tag ManagerЗатем создайте триггер в разделе «Клик», выбрав тип «Все элементы». В условиях активации триггера выберите вариант «Некоторые клики». Ниже отметьте фильтр «Click Text» и условие «Содержит», а также укажите нужный текст. После этого создайте тег в «Google Analytics» и опубликуйте его.

создание триггера в разделе «Клик», тип «Все элементы» в Google Tag ManagerМониторинг количества посетителей сайта и отслеживание конкретных источников

Чтобы выявить конкретное количество посетителей сайта создайте триггер, выбрав тип «Просмотр страницы». В качестве переменной используйте вариант «Referrer». Далее укажите «содержит» в правилах активации. Также необходимо указать URL отслеживаемого источника. Для отслеживания посещаемости конкретных страниц, необходимо в правилах активации выбрать «Равно», в качестве переменной указать «Referrer», а также ввести полный URL страницы.

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

Данную функцию можно применить для быстрой оценки количества источников трафика, в том числе и количества посещений с определенного сайта. Для этого создайте переменную, выбрав тип «Источник ссылки HTTP». В типе компонента выберите вариант «Имя хоста».

использование Google Analytics для отслеживания источников трафика в Google Tag ManagerДалее создайте триггер в разделе «Просмотр страницы» и в условии «Некоторые просмотры страниц» отметьте «Refeffef», условие «Не содержит», а также адрес страницы.

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

Заключение

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

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

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

Рекомендую:

Если хотите получить перспективную профессию или освоить новый навык (будь то SEO, HTML, веб-программирование или даже мобильная разработка), то посмотрите ТОП-3 лучших онлайн школ:

  • Нетология — одна из старейших школ интернет-профессий. Основные направления — маркетинг, управление, дизайн и программирование;
  • GeekBrains — специализируется, в первую очередь, на обучении программистов. После интеграции в Mail Group появились и другие профессии;
  • SkillBox — наиболее молодая из 3-х перечисленных школ, но обладает наибольшим ассортиментом специальностей. Если услышали о какой-либо экзотической профессии, то наверняка этому уже обучают в Skillbox.

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

Дата размещения/обновления информации: 09.04.2021 г.
Сообщить об ошибке
Пройдите, пожалуйста, защиту от спама.