Tag Assistant и состояния счетчиков Google Analytics

07 июля, 2020

Экспериментальный разбор нескольких способов установки счетчика Google Analytics для разных библиотек на сайт и отображение статусов расширения Tag Assistant (by Google) при различных настройках.

Установить счетчик Google Analytics на сайт можно по-разному:

  • напрямую в код сайта;
  • через Google Tag Manager;
  • через специальное поле в настройках администраторской панели сайта (обычно указывается только идентификатор счетчика).

При этом допускается использовать разные библиотеки Google Analytics, например, gtag.js и analytics.js. А после добавления счетчика Google Analytics желательно воспользоваться специальным расширением Tag Assistant для браузера Google Chrome, чтобы проверить корректность работы.

Как только вы включаете расширение на своем сайте, можете наблюдать различные состояния тегов. Один, два, синий тег, зеленый тег, желтый тег и т.д. Давайте разберемся с основными статусами Tag Assistant при установке счетчика Google Analytics на сайт.

№0. Код Google Analytics не добавлен на отслеживаемые страницы сайта

Как ни странно, но довольная частая ошибка, которая может привести к тому, что вы будете получать не все данные по посещениям страниц в отчетах Google Analytics. Если ваш сайт является статическим, или не имеет отдельного файла с шапкой сайта (например, header.php), который подключается ко всем страницам, то тогда код отслеживания необходимо размещать на все страницы сайта вручную, дублируя их в <head> на каждой странице. Если страниц много, то есть вероятность где-то код не добавить. В результате вы можете получить сообщение No tags found, которое говорит о том, что тег Google Analytics на текущей странице сайта не найден

Tag Assistant и состояния счетчиков Google Analytics

Теги не найдены

№1. Установка напрямую в код сайта (библиотека gtag.js)

На текущий момент является самым распространенным способом установки кода Analytics на сайт. После создания аккаунта Google Analytics с типом Веб вам предстоит добавить код отслеживания <!-- Global site tag (gtag.js) - Google Analytics --> на все страницы сайта после открывающегося тега <head>.

Примечание: если вы настраиваете новую учетную запись Google Analytics, вы всегда будете получать код отслеживания в формате Global site tag (gtag.js) - Google Analytics.

Открыв Google Tag Assistant, увидим следующее:

Tag Assistant и состояния счетчиков Google Analytics

Tag Assistant показывает 2 тега Google Analytics

Расширение показывает два тега Google Analytics:

  1. зеленый Global site tag (gtag.js);
  2. синий Google Analytics.

Зеленая иконка означает, что ошибок в теге не обнаружено, а синяя говорит о том, что тег размещен с незначительными ошибками. Однако это не значит, что данные не будут собираться в полном объеме или счетчик веб-аналитики работает как-то иначе, чем с зеленым значком. Просто в Tag Assistant заложены определенные рекомендации и этим цветом помечаются советы по оптимизации тегов.

Два тега - это абсолютно нормально. Первый Global site tag (gtag.js) – это фреймворк для добавления фрагментов кода JavaScript и работы с API, с помощью которого можно передавать данные о событиях в различные продукты Google (Analytics, Ads, Optimize, Display, Display & Video 360, Search Ads 360 и Campaign Manager).

Если внимательнее посмотреть на сам код Google Analytics (gtag.js), то можно увидеть, что первой строчкой у него идет подключение внешнего скрипта с помощью <script async src="..."></script>:

Tag Assistant и состояния счетчиков Google Analytics

Подключение к внешнему скрипту

Скопировав ссылку, добавив ее в адресную строку браузеру и нажав Enter, увидим сам код:

Внешний скрипт создает первый тег, который определяет расширение от Google. Подробнее о том, что из себя представляет глобальный тег сайта (Global Site Tag), читайте в этой статье.

Tag Assistant и состояния счетчиков Google Analytics

Первый тег от фреймворка

Вернувшись обратно на сайт, разберем второй тег. Тег Google Analytics с синим значком - это и есть наш счетчик Google Analytics, который отправляет хиты (обращения), включая просмотры страниц и различные события. Если мы нажмем на него, то увидим вкладку с основными данными по тегу (номер счетчика, версия и протокол), а также информацию о количестве запросов на просмотр конкретной страницы:

Tag Assistant и состояния счетчиков Google Analytics

Pageview Requests – количество запросов на просмотр конкретной страницы

В самом низу синим цветом отображается надпись Non-standard implementation. Это уведомление никак не влияет на работу Google Analytics и других тегов. Если вы нажмете на это сообщение, то вас перенаправит в справку Google, где будет написано подробнее о нестандартной реализации:

Мы обнаружили веб-запросы Google Tag Manager, но не смогли найти фрагмент кода на странице. Использование нестандартной реализации (Non-standard implementation) кода на странице может предотвратить запуск тегов. Убедитесь, что ваш фрагмент кода работает нормально. Вы можете использовать инструмент предварительного просмотра и отладки, чтобы обеспечить запуск всех тегов, добавленных в диспетчере тегов Google

Как видите, нет никакого описания про некорректную работы тегов. Просто в коде отслеживания Google Analytics (библиотеки gtag.js) присутствуют запросы GTM, которые определяются расширением Tag Assistant за счет подключения внешнего скрипта. Исправлять что-то из-за такого сообщения вовсе не обязательно.

В качестве эксперимента вы можете закомментировать первую строчку кода Google Analytics (с подключением скрипта), и снова проверить наличие тегов с помощью Tag Assistant. Расширение покажет сообщение об отсутствии тегов:

Tag Assistant и состояния счетчиков Google Analytics

Подключаемый скрипт закомментирован -> теги не найдены

№2. Установка напрямую в код сайта (библиотека analytics.js)

Способ по умолчанию, который использовали практически все, кто работал с Google Analytics с 2013 до августа 2017 года и без Google Tag Manager. Тогда еще не было библиотеки gtag.js, и код Universal Analytics, который копировали из интерфейса и добавляли на отслеживаемые страницы сайта, выглядел так:

И так:

Установив код таким способом, Tag Assistant отобразит один зеленый тег:

Tag Assistant и состояния счетчиков Google Analytics

Один тег Universal Analytics

№3. Установка двух кодов одновременно (gtag.js и analytics.js)

Бывают ситуации, когда у вас на сайте могут быть размещены два кода Google Analytics (с одинаковым идентификатором отслеживания) одновременно, причем от разных библиотек. Либо вам так посоветовали сделать, либо вы когда-то настраивали один раз, а потом еще раз. И забыли удалить. Часто я встречал такое на практике, когда один код добавлен через администраторскую панель на сайте, а второй вручную в код сайта.

Если с такой реализацией мы перейдем в расширение, то Tag Assistant выдаст следующее:

Tag Assistant и состояния счетчиков Google Analytics

Установка двух кодов одновременно (gtag.js и analytics.js)

Желтый значок свидетельствует о непредвиденных последствиях, которые могут возникнуть в этом теге. Если мы нажмем на него, то увидим важный звоночек - рядом с Pageview Requests стоит цифра 2 и ниже сообщение:

Tag Assistant и состояния счетчиков Google Analytics

Дубли просмотра страниц

Это означает, что вы отправляете как минимум 2 Pageview (Просмотр страницы) в один Google Analytics. Такая ошибка, как правило, возникает, если вы установили несколько одинаковых кодов счетчиков на сайт, или же добавили лишнюю отправку Pageview через Google Tag Manager или дополнительную строчку кода в счетчик Google Analytics:

2 Pageview будут искажать статистику в отчетах Google Analytics, задубливать данные. Вместо одного просмотра страницы вы будете видеть два. Чтобы этого избежать, исправьте настройки счетчика и отправляйте только один Pageview на каждой странице.

Несколько счетчиков Google Analytics

Вы можете установить несколько счетчиков Google Analytics на своих веб-страницах, чтобы отправлять данные в несколько ресурсов аккаунта. Использование нескольких тегов может быть полезно, если пользователям, имеющим доступ к различным ресурсам, необходимо просматривать данные с одного и того же веб-сайта или если у вас есть несколько версий веб-сайта.

Например, вы можете собирать данные с сайта site.ru с помощью одного счетчика аналитики, данные для поддомена my.site.ru в другом экземпляре Google, и использовать третий код счетчика Google Analytics на обоих веб-сайтах, чтобы увидеть суммарные данные.

Также несколько счетчиков могут отображаться из-за частой смены подрядчика. Коды, которые установлены на сайте, как правило, размещаются вашими разработчиками по их техническому заданию. Когда вы работаете с одним исполнителем, он может попросить поставить свой код отслеживания Google Analytics (ему так удобнее), когда вы разрываете с ним сотрудничество и находите другого, тот тоже может желать установить свои коды, чтобы не разбираться в чужих настройках. В результате переходов от одного подрядчика к другому на сайте может быть установлено достаточно большое количество счетчиков с разными идетификаторами. А старые вы просто забываете/не хотите удалять. Но все же это лучше делать, поскольку у исполнителей останется вся статистика по вашему проекту.

№4. Установка нескольких счетчиков с разными идентификаторами (библиотека gtag.js)

Интересное поведение Tag Assistant после добавления 2 счетчиков Google Analytics с разными идентификаторами (библиотека gtag.js). Исходя из способа №1 мы должны получить 4 записи (2 с зеленым тегом и 2 с синим). Но получаем 5 и сообщения Multiple installations of Global site tag (gtag.js) detected и Multiple Google Analytics tags detected:

Tag Assistant и состояния счетчиков Google Analytics

вапавп

У одного счетчика, помимо предыдущих двух записей, появляется еще одна строка Global site tag (gtag.js). А открыв этот тег, увидим данные по запросу на Redirected URL и дополнительные параметры запроса:

Tag Assistant и состояния счетчиков Google Analytics

Redirected URL и дополнительные параметры запроса

У второго счетчика Google Analytics такого нет. Если перейти в консоль разработчика на вкладку Network (Сеть) и посмотреть перечень запросов, то можно увидеть несколько:

  1. запрос счетчика gtag.js для одного идентификатора;
  2. запрос счетчика gtag.js для другого идентификатора;
  3. запрос первого счетчика UA- с дополнительными параметрами.
Tag Assistant и состояния счетчиков Google Analytics

Три запроса на вкладке Network (консоль разработчика)

Сказать однозначно я не могу, но есть предположение, что здесь играет роль последовательность расположения счетчиков в коде страницы и порядок их загрузки. Для первого создается дополнительные параметры запроса по причине установки нескольких счетчиков Google Analytics с библиотекой gtag.js, хотя подключамый (внешний) скрипт, фактически, один и тот же. При добавлении третьего счетчика Google Analytics Tag Assistant уже находит 8 записей (2x3+2), дублируя дополнительные запросы для всех, кроме одного. При добавлении четвертого счетчика тегов становится 11 (2x4+3). Сама настройка нескольких счетчиков таким способом корректно, поэтому уведомлениями и дополнительными тегами в Tag Assistant можно пренебречь.

№5. Установка нескольких счетчиков с разными идентификаторами (библиотека analytics.js)

Аналогично для библиотеки analytics.js. При добавлении нескольких счетчиков с разными идентификаторами мы получим критические ошибки:

Tag Assistant и состояния счетчиков Google Analytics

Несколько счетчиков с разными идентификаторами

Это может происходить потому, что вы просто добавили два одинаковых кода Google Analytics подряд, которые отличаются только одним идентификатором.

Tag Assistant и состояния счетчиков Google Analytics

Два кода отличаются только идентификаторами

А ошибка, которую мы получаем в Tag Assistant, все та же - 2 PageView:

Tag Assistant и состояния счетчиков Google Analytics

2 Pageview Requests

Хоть мы установили два разных кода, 2 Pageview Requests будет приписываться одному счетчику Google Analytics. Чтобы два счетчика корректно работали между собой и отправляли статистику в отчеты, необходимо присвоить счетчикам имена, используя поле name в качестве четвертого аргумента команды create:

Счетчик Google Analytics, созданный без указания названия в поле name, называется счетчиком по умолчанию. Ему присваивается внутреннее название t0. Чтобы отслеживать данные двух ресурсов, необходимо создать два отдельных счетчика. При этом по крайней мере одному из них должно быть присвоено название. То есть можно использовать название по умолчанию t0 и какое-нибудь еще:

А чтобы выполнять команды analytics.js для отдельных счетчиков, в префиксе команды нужно указать его название с точкой. Если оно не указано, команда выполняется для счетчика по умолчанию.

Чтобы отправить обращения типа pageview (просмотр страницы) для двух счетчиков, нужно выполнить две команды:

Таким образом, для того, чтобы установить 2 счетчика Google Analytics с разными идентификаторами, используя библиотеку analytcs.js, необходимо сделать так:

Tag Assistant и состояния счетчиков Google Analytics

Пример кода для двух счетчиков Google Analytics (analytics.js)

Тогда и Tag Assistant отобразит два счетчика Google Analytics корректно, каждый из них будет совершать по 1 Pageview Requests:

Tag Assistant и состояния счетчиков Google Analytics

Корректное отображение в Tag Assistant

Теперь переходим к настройке Google Analytics через Google Tag Manager!

Для реализации тегов продуктов Google (Google Реклама и Google Платформа для маркетинга) можно использовать как Google Tag Manager, так и Global Site Tag (gtag.js). Оба метода полностью поддерживаются. О том, какой тег выбрать для работы, читайте в официальный справке Google.

№6. Google Tag Manager без тегов 

Здесь должно быть все просто. После добавления кода Google Tag Manager на все страницы сайта и его публикации в Tag Assistant должна появится запись о найденном контейнере GTM с зеленой иконкой:

Tag Assistant и состояния счетчиков Google Analytics

Тег Google Tag Manager в Tag Assistant

Теперь можно приступать к настройке тегов.

№7. Установка через Google Tag Manager (библиотека gtag.js)

Global Site Tag можно установить через Google Tag Manager с помощью тега типа Пользовательский HTML тег, просто добавив код из интерфейса Google Analytics:

Tag Assistant и состояния счетчиков Google Analytics

Установка gtag.js через Google Tag Manager с помощью тега Пользовательский HTML

Установка аналогична способу №1, поскольку GTM - это просто контейнер, в котором мы можем вставить код. А поскольку код добавляете такой же, то и результат будет прежним - 2 тега:

Tag Assistant и состояния счетчиков Google Analytics

Аналогично способу №1, только через GTM

Разработчики Google не рекомендуют размещать таким способом код на сайте. Вместо этого лучше использовать шаблон тега Google Аналитика - Universal Analytics.

№8. Установка через Google Tag Manager (библиотека analytics.js)

Для данной реализации в GTM заложен шаблон тега, который называется Google Аналитика - Universal Analytics. На данный момент, его использование является самым распространным решением установки кода Google Analytics через GTM. Подробнее о том, как добавить счетчика GA через диспетчер тегов, читайте в этой статье.

Tag Assistant покажет зеленый значок для Google Tag Manager и синий для счетчика Google Analytics:

Tag Assistant и состояния счетчиков Google Analytics

Настройка через тег Google Аналитика - Universal Analytics

Если в него перейти, то можно увидеть известную нам запись Non-standard implementation. О том, что это значит, читайте в начале статьи. Это уведомление никак не влияет на работу Google Analytics и других тегов.

№9. Установка двух разных счетчиков через Google Tag Manager (библиотека analytics.js)

Последний эксперимент, который хотелось бы провести - это создать два одинаковых тега Google Аналитика - Universal Analytics, но с разными идентификаторами отслеживания.

Tag Assistant и состояния счетчиков Google Analytics

Два различных счетчика Google Analytics через GTM

Примечательно, но никаких ошибок не произошло. В отличие от установки кода нескольких счетчиков напрямую, Tag Assistant корректно отобразил состояние тегов. Это означает, что диспетчер тегов сам определяет, какое количество тегов будет развернуто на сайте и с помощью каких библиотек. А в случае, если библиотеки совпадают, но коды разные, GTM задаст другое название счетчику и будет передавать хиты (обращения) в оба счетчика правильно.

№10. Установка счетчика через специальное поле в настройках администраторской панели сайта

При этой настройке все зависит от реализации того движка, на котором у вас работает сайт. Например, конструктор Tilda запрашивает только идентификатор отслеживания счетчика, а интернет-магазин на OpenCart предоставляет возможность установить дополнительные модули и расширения. Например, добавление кода Google Analytics выглядит так:

Tag Assistant и состояния счетчиков Google Analytics

Пример добавления кода через админку сайта OpenCart

Соответственно, и состояние счетчиков в Tag Assistant будет отличаться в зависимости от реализации.

Получайте бесплатные уроки и фишки

По контекстной, таргетированной рекламе и аналитике