Инструкция по Google Tag Manager от Инитлаб

Для полноценной аналитики самого сайта и продаж на нём необходима интеграция с внешними сервисами — например Яндекс.Метрика, Google Analytics, Битрикс24, Roistat, а также подключение пикселей Facebook и ВКонтакте. Но при таком количестве скриптов вы обязательно столкнётесь с необходимостью их упорядочить.

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

Решение есть: инструмент, с помощью которого внедрить новый скрипт сможет и маркетолог, и специалист по SEO — Google Tag Manager.

В этом посте я делюсь нашей внутренней инструкцией по внедрению GTM.

Google Tag Manager несёт сплошные плюсы — экономит время, деньги и силы.

Если у вас есть своя команда — они могут воспользоваться нашей инструкцией для внедрения GTM.

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

Чтобы быстро управлять множеством скриптов в маркетинговых целях без участия программистов можно использовать Google Tag Manager (GTM).

Google Tag Manager – это не счетчик веб-аналитики, он не имеет самостоятельных параметров, показателей, не собирает данные, не хранит их у себя, не предоставляет отчетов, не заменяет Google Analytics, Яндекс.Метрику и другие сервисы. Он лишь позволяет гибко управлять различными тегами в одном пространстве.

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

Алгоритм для маркетолога:

1. Создайте новый или выберите аккаунт на https://tagmanager.google.com/

2. Нажмите на номер счётчика и скопируйте скрипт GTM

Инструкция по Google Tag Manager от Инитлаб

3. Передайте скрипт из 2-х фрагментов для установки программистам.

Действия разработчика:

1. Получите код от маркетолога или создайте самостоятельно как указано выше. На 2021 код выглядит так: Фрагмент для вставки в раздел <head>:

<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({‘gtm.start’: new Date().getTime(),event:‘gtm.js’});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!=‘dataLayer’?‘&l=‘+l:‘’;j.async=true;j.src= ’https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,‘script’,‘dataLayer’,‘GTM-XXXXXXX’);</script>  Код для вставки после открывающего тега <body>:  <noscript><iframe src=“https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX” height=“0" width=“0” style=“display:none;visibility:hidden”></iframe></noscript>

Где GTM-XXXXXXX — номер счётчика.

2. Вставьте код GTM в шаблон сайт.

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

Создайте аккаунт в Google Analytics по ссылке, если у вас его ещё нет: https://marketingplatform.google.com/about/analytics
С 2021 года по умолчанию создаётся новая версия Google Аналитика 4 — версия с возможностью отслеживать одновременно и сайт, и приложение.
https://support.google.com/analytics/answer/9306384?visit_id=637636739302520886-3210569817&rd=1

В Google Tag Менеджере создайте новый тег — Google Аналитика конфигурация GA4 или Universal Analytics:

Выбираете: Теги → Создать.
Далее: Конфигурация тега.
Выбираете GA4 или Universal Analytics.
Вводите идентификатор потока данных для GA4 — номер счётчика в Google Analytic, он написан в правом верхнем углу, начинается на G-.

Либо оставляйте тип отслеживания для Universal Analytics «Просмотр страницы» и тут же, в настройках GA, создайте новую переменную, куда впишете номер счётчика из Google Analytics.

В разделе «Триггеры» выберите события, которые будут активировать тег — All Pages (то есть просмотр всех страниц).
Сохраните конфигурацию тега и нажмите «Опубликовать контейнер».

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

Если у вас нет счётчика Яндекс.Метрики, то вы переходите на сайт https://metrika.yandex.ru/ и создаёте счётчик.
Заполните поля и включите Вебвизор по необходимости.
Для установки кода счетчика через GTM необходимо выбрать «Системы управления тегами».Дополнительные настройки оставьте по умолчанию пустыми.

Чекбокс: поставьте метку на пункте «Отправка в Метрику данных электронной коммерции». Это необходимо, если планируете подключить e-commerce через интерфейс и собирать данные о количестве заказов, сумме покупок и т. д.

4. Скопируйте код счётчика и вернитесь в интерфейс GTM.

Далее проделайте стандартную процедуру установки кода:

Перейдите в «Теги».
Нажмите «Создать».
Во вкладке «Конфигурация тега» выберите «Пользовательский HTML».
Вставьте скопированный код счетчика.
Установите триггер «All Pages» на все страницы сайта.
Сохраните и опубликуйте изменения.

Если код отслеживания Метрики уже был размещен на сайте, после добавления его в GTM удаляем его с сайта.

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

Подписывайтесь на мой блог если вам интересна тема тонкой настроки GTM, особенности работы с Google Analytics 4, тестирование гипотез в Google Optimize и т.д.

Инструкция по Google Tag Manager от Инитлаб

Краткая справка

Размещение кода GTM

Добавление скриптов аналитики Google Analytics в GTM

Добавление скриптов аналитики Яндекс.Метрика в GTM