Советы и хитрости для Google Assistant: от новичка до эксперта. Данные о страницах

  • Tutorial

Относительно недавно, мы проводили редизайн и оптимизацию нашего сайта и наткнулись на ряд проблем связанных со скриптами и кодами отслеживания от Google. А именно:

  • проблема избытка кода Google в коде страниц (отслеживание событий, Google A/B tests, Google Analytics)
  • неудобство управления и слежения за скриптами.
  • постоянная необходимость редактирования шаблонов страниц, для внесения изменений и дополнительных параметров в скрипты.
  • зависимость от релизов на поддоменах (индивидуальный случай). Например, над личным кабинетом работает не один человек, а команда разработки с использованием контроля версии (VSC) и для внесения малейших изменений приходилось ждать очередного релиза.
В данной статье мы рассмотрим решение данных проблем на примере Google Analytics, посредством Диспетчера тегов от Google (Google Tag Manager) и рассмотрим новую модель организации работы со скриптами, для анализа работы сайта с практическими примерами и кучей картинок.

Речь пойдет о Google Tag Manager (диспетчер тегов Google).

Основные преимущества перехода на диспетчер тегов на наш взгляд:

  • минимум кодинга на страницах. Убираем все скрипты от Google из кода страниц. Останется лишь код вставки Диспетчера тегов (код контейнера)
  • прозрачность и удобство. Удобство настройки и слежения за скриптами. Все управляется и настраивается из панели управления Диспетчера тегов. Мы видим все скрипты и к каким страницам и событиям они привязаны
  • масштабируемость. Больше не нужно затрагивать код страниц. Вы можете добавлять и настраивать код Google Analytics, отслеживания конверсий AdWords, ремаркетинга AdWords и много другого из личного кабинета диспетчера тегов.
  • система контроля версий. Любые изменения можно с легкостью отменить и вернуть на более ранний state, а так же следить за тем, кто, где и когда вносил изменения.
  • режим многопользовательской работы.
Также, если у вас имеется ресурс, который разрабатывается с использованием контроля версий и чтобы внести изменения в код страниц, приходится ждать очередного релиза, тогда Диспетчер тегов Google - это именно то, что вам нужно.Немного теоретической части

Для быстрого старта, нам понадобиться разобрать основные термины, которые необходимы для начала работы с Google Tag Manager, а именно:

  • Аккаунт
  • Контейнер
  • Правила
  • Макросы
Эти термины будут встречаться как в статье, так и в любой документации от Google.

Аккаунт - это аккаунт=) как и в Google Analytics, в представлении не нуждается.

Контейнер - это главный и единственный фрагмент JS-кода, который мы вставляем на все страницы сайта. По сути, он является тегом, но его функция заключается в том, что он служит контейнером для всех тегов. О них написано чуть ниже. Своего рода «архитег», который запускает все остальные теги, при соответствии их правилам которые мы задали.

Тег - это фрагмент JS-кода. Все те скрипты, которые мы раньше вручную вставляли на страницы сайта, например, код Google Analytics, код отслеживания конверсий Adwords, пользовательский код и т.д.

Правило - это условие, при котором будет вызываться и выполняться тег или наоборот (блокироваться). Например, для кода Google Analytics правилом «выстрела» мы зададим: «на всех страницах».

Макросы - «Макросы являются парами типа имя/значение, для которых передаются значения в процессе работы». Используются при настройке правил. В нашем случае, переменные уровня данных для отслеживания событий (Event Tracking) в связке с целями Google Analytics, подробнее в практической части

Обобщим, в коде страницы имеется код контейнера. В контейнер с сервера Google подгружаются и активируются теги, которые соответствуют правилам активации. Макросы нужны для настройки тегов и правил.


Рис.1 Схема взаимодействия элементов

Практический пример А теперь рассмотрим вышеперечисленное на простейшем примере с использованием основных возможностей.

У Google есть замечательный инструмент в виде плагина для Google Chrome - «Tag Assistant» . Устанавливаем и вернемся к нему чуть позже.

Итак, предположим, имеется:

  • сайт - example.com
  • личный кабинет на поддомене - accounts.example.com
Необходимо:
  • разместить код Google Analytics
  • настроить отслеживание конверсии при клике на определенную кнопку
Регистрируем Google Analytics и Google диспетчер тегов.
В диспетчере тегов создаем аккаунт (рис.2).


Рис.2 Создание аккаунта

Далее создаем контейнер (рис.3). Указываем тип: «Веб-страницы» или «Мобильные приложения» и указываем наши домены(что, в принципе, необязательно). В нашем случае, поддомен мы не указываем, поскольку будем использовать междоменное отслеживание.


Рис.3 Создание контейнера

Готово! нам дают тот самый заветный код контейнера, который мы должны разместить сразу же после открывающего тега.

Код контейнера обязательно и всегда должен быть самым первым после открывающего тега, в противном случае вы рискуете потерять возможность отслеживания событий (Event Tracking) находящих ДО кода контейнера. Поскольку все переменные уровня данных, которые находятся до Диспетчера тегов, обрабатывать не будут.
Для большей гибкости и удобства - для основного домена и поддоменов лучше использовать разные контейнеры.

Там же - нам предлагают одним нажатием вставить теги. Выбираем тег «Google Analytics»(рис.4)


Рис.4 Код контейнера и меню выбора тегов

  • ввести «идентификатор веб-ресурса» - это старый добрый код счетчика
  • «добавить правило активации тега» - там ставим галочку напротив «все страницы». то есть код Google Analytics будет срабатывать на всех страницах сайта.
  • так как у нас имеется поддомен - открываем вкладку
  • «Дополнительные настройки» > «Домены и каталоги» и ставим галочку напротив «разрешить связывание» (это и есть междоменное отслеживание)


  • Рис.5 Настройка тега Google Analytics

    С тегом Google Analytics закончили. Следующим этапом мы настроим макрос на отслеживание событий (Event Tracking). Нам понадобится создать 3 макроса, а потом на основе них - тег отслеживания.

    Итого, у вас должно получиться 3 новых макроса с именами переменных уровня данных: eventCategory , eventAction , eventLabel . В качестве правила для активации, нам еще понадобиться макрос «event», но он уже создан по умолчанию.


    Рис.6 Создание макроса

    Далее создаем новый тег, выбираем тип тега - «Google Analytics», вставляем тот же код счетчика в поле идентификатора, а вот в типе отслеживания - выбираем «событие» и далее вставляем созданные нами макросы из списка, соответственно:

    • категория - GA Event Category
    • действие - GA Event Action
    • ярлык - GA Event Label


    Рис.7 Создание тега отслеживания Google Analytics

    Теперь нам нужно задать правило активации тега (рис.8). Создаем новое правило, в котором мы используем макрос «event»


    Рис.8 Создание правила активации

    Как это работает? переменные уровня данных, у нас будут передаваться в таком виде:

    Так как мы не хотим затрагивать код страниц, привязываем действие по клику с помощью jQuery и подключаем через Google Tag Manager(пользовательский тег), подобным образом:
    $(document).ready(function(){ $("селектор нужного объекта").click(function() { dataLayer.push({"event":"GAevent", "eventCategory":"Заданное нами значение", "eventAction":"Заданное нами значение", "eventLabel":"Заданное нами значение"}); }); });


    Рис. 9 Добавляем пользовательский тег

    То есть, при клике по объекту, мы будем передавать переменные уровня данных методом .push() и теми значениями, которые мы будем задавать в целях Google Analytics.

    Итак, у нас вышло 4 наших макроса: «event», «eventCategory», «eventAction», «eventLabel»
    и четыре пары значений:

    • ‘event’ : ’GAevent’
    • ‘eventCategory’ : ’value’
    • ‘eventAction’ : ’value’
    • ‘eventLabel’ : ’value’
    Значения мы задаем в панели Google Analytics, в «настройках цели».

    Чтобы нагляднее проследить взаимосвязь - см. рис.10


    Рис. 10 Взаимосвязь переменных уровня данных, макросов и целей Google Analytics

    Создаем цели в Google Analytics, вставляем переменные в наш метод dataLayer.push() для ссылки которую будем отслеживать.


    Рис. 11 Создание версии и публикация контейнера

    Проверяем: перейдя на страницу сайта открываем «Tag Assistant», о котором говорилось в самом начале практической части.

    Рис.12 окно Tag Assistant

    Мы видим код нашего счетчика, код контейнера. Зеленый статус «working» говорит о том, что всё отличненько. В противном случае, он бы описал проблему и предложил рекомендации к ее решению. Также, мы видим наш Data Layer.(зачастую, данные dataLayer не отображаются в панели "tag assistant" и это норма).

    Вот и всё.

    Ну и так вот, на дорожку:
    Рассмотренное в данной статье - лишь малая и простейшая часть того, что на самом деле представляет из себя Диспетчер тегов (Google Tag Manager) и какие возможности открываются перед нами при углублении во все нюансы.

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

    Для этого могут быть использованы различные инструменты. В Google для проверки корректности работы тегов своих систем создали свой инструмент - Google Tag Assistant, который устанавливается как плагин к браузеру. Я буду рассматривать работу плагина в браузере Chrome.

    После установки в списке значков плагинов у появится новый, при клике на который левой кнопкой мыши откроется следующее окно:

    Здесь необходимо выбрать теги каких систем вы планируете проверять (отслеживать), а также какие страницы подпадают под проверку все или выбранные. Указав необходимые вам параметры сохраните настройки нажав на кнопку Done .

    Вы увидите сообщение, что Google Tag Assistant не активен (отключен) на текущей странице и вы можете включить его:

    Для включения необходимо нажать Enable (про возможность записи, кнопка Record , поговорим ниже).

    После включения плагина необходимо перезагрузить страницу, чтобы информация по ней отобразилась в Google Tag Assistant, либо перейти на следующую. Вне зависимости от действия в следующий раз Google Tag Assistant “соберет” необходимую информацию и она станет доступна для просмотра. При этом в списке плагинов у Google Tag Assistant появится дополнительная информация в виде количества тегов, обнаруженных на текущей странице:

    Google Tag Assistant – количество тегов

    Если кликнуть левой кнопкой мыши на этом значке, отобразится окно:

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

    • зеленый – если тег сработал корректно;
    • синий – если есть не критичные замечания;
    • красный – имеются серьезные ошибки.

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

    В верхней правой части окна выводится информация об общем количестве тегов на странице, а при наличии ошибок и их количество:

    Возможна ситуация, когда теги не будут обнаружены на странице, в этом случае информация выглядит таким образом:

    Для получения подробной информации об интересующем теге достаточно в списке нажать на него:

    Отобразится подробная информация по тегу (на примере Google Analytics):

    На что необходимо обратить внимание. Первое это способ внедрения Google Analytics, на скриншоте это Implemented in Google Tag Manager , т.е. через Google Tag Manager, второе на количество хитов, которые были отправлены тегом до того, как вы открыли это окно:

    Здесь отображается тип хита, например, Events (события) и количество хитов этого типа (1 в зеленом круге).

    Выбрав тип хита вы “погружаетесь” в список хитов выбранного типа (конечно если их несколько), где можно узнать сведения, которые были переданы в Google Analytics:

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

    Помните, в начале я упоминал кнопку Records ? Она необходима для записи тегов на страницах и другой информации, чтобы ее не просматривать каждый раз на странице, а выполнить переходы по ссылкам внутри сайта, после чего изучить собранную информацию по каждой странице. Чтобы воспользоваться этим отчетом откройте окно Google Tag Assistant и нажмите кнопку Record . Вы увидите предупреждение:

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

    Теперь после перезагрузки страницы или перехода по ссылке на ней Google Tag Assistant начнет фиксировать и записывать информацию. В списке плагинов у значка Google Tag Assistant появится дополнительное обозначение в виде красного круга, которое указывает на активность опции записи:

    Вы выполняете навигацию по страницам, Google Tag Assistant записывает информацию. Если необходимо завершить запись или ознакомиться с записанными сведениями откройте окно Google Tag Assistant и выберите необходимое действие в нижней части страницы:

    Перед просмотром информации отображается сообщение:

    Вам предоставляется возможность просмотреть отчет Show full report или возобновить/продолжить запись Resume recordind . Для просмотра отчета вам потребуется пройти авторизацию на Google.

    Информация отображается в отдельной вкладке браузера и делится на два блока:

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

    Используйте Google Tag Assistant при внедрении и настройке Google Analytics, но не забывайте, что лучше использовать не один, а несколько инструментов, которые будут дополнять друга-друга помогая вам решать текущие задачи.

    Не беда. Есть один способ, как это можно осуществить. Хотя сейчас он работает только на некоторых устройствах. Вообще, перенос помощника на другие Android-устройства с версией Marshmallow и выше уже в процессе. Пока же можно воспользоваться приложением Google Allo. Ходят слухи, что Google пока еще дорабатывает интерфейс. Вместе с тем компания OnePlus недавно заявила, что Google Assistant будет совместим со смартфонами OnePlus 3 и OnePlus 3T.

    Что представляет собой Google Assistant?

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

    Другие варианты получения помощника

    Раньше на смартфонах (отличных от Google Pixel) с Android 5.0 Lollipop и выше можно было заполучить Google Assistant, используя установочный файл APK альфа-версии Google App. Впрочем, сейчас этот способ неактуален, так что даже пробовать не имеет смысла. Надеемся, что вскоре Google расширит список смартфонов, поддерживающих Assistant. Ну а пока мы советуем нашим читателям обратить внимание на Google Allo.

    А что вы думаете насчет ассистента от Google? Пробовали ли установить его на своем устройстве? Поделитесь своим опытом в комментариях.


    Быстрая проверка сайта и настроек Google Аналитики.

    С помощью этого инструмента вы можете регистрировать переходы пользователей на сайте и оценивать правильность внедрения кода Аналитики. Используйте полученную информацию, чтобы определить, есть ли проблемы с дизайном вашего ресурса и получаете ли вы все необходимые данные. Google Tag Assistant Recordings также поддерживает проверку тегов в других продуктах Google, таких как Google Реклама, Менеджер кампаний и Менеджер тегов.

    Содержание Проблемы с дизайном сайта

    Записывая переходы пользователей, вы получаете информацию о том, возникают ли у них при этом трудности, например:

    • Целевые страницы не соответствуют тем объявлениям или ссылкам, по которым перешли пользователи.
    • Призывы к действию заметны не сразу.
    • Макет страницы или навигация по сайту затрудняют достижение пользователями тех целей, которые вам нужны.
    Проблемы с настройками Google Аналитики

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

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

    В Аналитике автоматически проводится регулярная диагностика ресурсов, но у нее есть определенные ограничения, например:

    • Проверяются уже собранные данные, что не позволяет отфильтровывать недостоверную информацию с самого начала.
    • Нельзя сканировать страницы, которые требуют аутентификации или входа с паролем, а также показываются динамически (например, в процессе покупки через Интернет).
    • При такой проверке не учитывается структура сайта и то, как пользователи переходят между страницами.
    • Диагностика показывает, исправлена ли проблема, только после сбора и обработки достаточного объема данных. За это время у вас может накопиться ещё больше недостоверной информации.

    В Google Tag Assistant Recordings таких ограничений нет.

    Как работает Google Tag Assistant Recordings

    Эта функция – часть расширения Google Tag Assistant для браузера Chrome. С ее помощью можно регистрировать теги, события и взаимодействия для любой последовательности посещенных страниц или сайтов. В Google Tag Assistant Recordings доступна запись информации обо всех страницах, которые открывал пользователь, даже если часть из них находится за пределами вашего основного домена.

    Например, часто пользователь сначала ищет продукт в Интернете, а затем переходит на ваш сайт по платному объявлению или ссылке в результатах обычного поиска. Он изучает каталог, добавляет нужный товар в корзину (которая может находиться на другом домене), проверяет заказ, указывает платежные данные и адрес доставки, нажимает кнопку "Оформить заказ" и возвращается на страницу с благодарностью, где регистрируется достигнутая конверсия.

    Когда у вас включена функция Google Tag Assistant Recordings, записывается информация обо всех страницах, в том числе тех, которые не являются частью вашего сайта или создаются динамически (например, страница просмотра заказа в корзине). Для каждой страницы проводится ряд тестов, и в конце создается отчет о результатах. В него входят только данные, связанные с вашими действиями. Действия других пользователей не учитываются.

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

    При повторном анализе записи обращения не передаются в Google Аналитику. Устраняйте неполадки и экспериментируйте с настройками – это не повлияет на данные.

    С помощью Google Tag Assistant Recordings можно выполнять проверку тегов не только в продуктах Google, но и на сторонних сайтах.

    Отчеты Google Tag Assistant Recordings

    В Google Tag Assistant Recordings доступны два отчета:

    Отчет Tag Assistant

    В этом отчете содержатся данные обо всех тегах, которые были активированы на страницах, посещенных вами во время записываемого сеанса. Это могут быть теги Google (например, коды отслеживания Google Аналитики, а также теги Google Tag Manager и ремаркетинга Менеджера кампаний) или сторонних источников. Последние могут включать в себя теги Google или управлять ими.

    Отчет Google Аналитики

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

    Для кого предназначен этот инструмент

    Инструмент Google Tag Assistant Recordings разрабатывался для двух основных групп пользователей:

    Для маркетологов. Специалисты, принимающие решения с учетом данных Google Аналитики, могут использовать Google Tag Assistant Recordings для быстрой проверки взаимодействия сайта и Аналитики при текущих настройках.

    Для разработчиков. Специалисты, которые создают веб-продукты и добавляют в них теги (в том числе теги Google Аналитики), могут получать подробную информацию, которая помогает проверять ресурсы и устранять неполадки.

    Что нужно для использования Google Tag Assistant Recordings

    В настоящее время функция Google Tag Assistant Recordings доступна только как часть расширения Google Tag Assistant для браузера Chrome.

    Ограничения
    • Несохраненные данные остаются доступны только до тех пор, пока вы не закроете окно браузера или не начнете новую запись.
    • При сохранении записи в ней остаются только данные Google Аналитики. Сведения, полученные от расширения Google Tag Assistant удаляются вместе с сопутствующим отчетом, однако его можно сохранить в формате PDF и распечатать.
    • В настоящее время функция Google Tag Assistant Recordings доступна только на английском языке.
    Конфиденциальность

    Сеансы, записанные с помощью Google Tag Assistant Recordings, доступны только вам. Расширение не сохраняет и не отслеживает ваши действия в сети (помимо обращений, которые отправляются в Google Аналитику в ходе анализа).

    Предлагаем вашему вниманию пошаговую инструкцию по установке и настройке Google Tag Manager (GTM). Здесь же мы расскажем, как с помощью GTM подключить Google Analytics и Яндекс Метрику.

    Google Tag Manager (GTM) – многофункциональный инструмент, который позволяет добавлять на сайт или в мобильное приложение теги для анализа трафика, конверсии и поведения пользователей без вмешательства в исходный код сайта.

    В статье мы подробно опишем, как создать и настроить GTM на сайте и как без вмешательства в исходный код сайта подключить Google Analytics и Яндекс Метрику.

    Преимущества GTM
    • Можно добавлять и обновлять теги без вмешательства в исходный код сайта. Нужно всего один раз добавить на сайт код Диспетчера тегов, а всё остальное уже можно внедрять в личном кабинете GTM;
    • Уменьшение кода на страницах веб-сайта;
    • Удобный и простой в использовании интерфейс;
    • Простота тестирования. Режим предварительного просмотра позволяет маркетологам легко проверять корректность работы тегов;
    • Сервис бесплатный.

    Прежде чем перейти к установке, разберёмся в определениях:

    • Контейнер – это фрагмент JS-кода, который размещается на всех страницах сайта. Внутри контейнера содержится информация о тегах, которые запускаются вследствие выполнения определённых правил, заданных в триггерах и переменных;
    • Тег – фрагмент кода сайта, который позволяет отслеживать трафик и анализировать поведение пользователей, конверсию и т. д. (например, код Яндекс Метрики);
    • определяют, когда нужно активировать тег в веб-контейнере;
    • Переменные – это пара «имя-значение», которая используется в триггере как условие, при котором будет срабатывать тег.
    Как установить Google Tag Manager на сайт

    1. Зарегистрируйте аккаунт в Google

    Если ваш аккаунт в Google уже зарегистрирован и вы авторизированы, пропустите этот шаг. Если нет – авторизуйтесь или создайте аккаунт .

    2. Создайте аккаунт в GTM

    После авторизации в Google можно переходить к созданию аккаунта в GTM. Перейдите на страницу Google Tag Manager и нажмите на кнопку «Создать аккаунт», затем укажите придуманное название аккаунта и нажмите на кнопку «Далее».

    Рисунок 1

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

    Рисунок 2

    Рисунок 3


    3. Добавьте на сайт полученный код Диспетчера тегов

    После того как вы примете соглашение об использовании, появится окно с кодом.

    Рисунок 4

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

    Рисунок 5

    Код из нижнего блока вставьте непосредственно после открывающего тега.

    Рисунок 6

    После того как вы выполните эти действия, нажмите в панели GTM на кнопку «Опубликовать».

    Рисунок 7


    4. Протестируйте корректность работы GTM

    Далее важно проверить, всё ли вы сделали верно. Для этого можно воспользоваться плагином Google Tag Assistant Recordings для браузера Chrome. Установите это расширение, перейдя по ссылке .

    После установки на панели расширений браузера Chrome появится значок Google Tag Assistant - . Для проверки корректности работы установленного на сайт GTM нужно перейти на свой сайт и нажать на этот значок.

    Рисунок 8

    Из скриншота видим, что значок зелёного цвета, это значит, что установка Диспетчера тегов прошла успешно. Если значок жёлтого или красного цвета – тег размещён с ошибками.
    Рекомендации Google

    Рисунок 9

    Подключение Google Analytics через GTM

    Теперь приступим непосредственно к подключению Google Analytics через GTM.


    1. Зарегистрируйте Google Analytics

    Если на сайте уже установлена аналитика, этот пункт можно пропустить. Если нет, ознакомьтесь с тем, как зарегистрировать Google.Analytics , и пройдите регистрацию.

    Обратите внимание! После регистрации Google.Analytics код на сайте размещать не нужно. Нам чуть позже понадобится только идентификатор отслеживания Google.Analytics. Если Google.Analytics зарегистрирован ранее и на сайте уже размещён код, после подключения Google.Analytics через GTM ранее размещённый код аналитики можно убирать.


    2. Войдите в зарегистрированный ранее аккаунт в GTM и кликните по ссылке «Добавить новый тег»

    Рисунок 10


    3. Выберите тип тега

    В данном случае нам нужен Universal Analytics.

    Рисунок 11


    4. Укажите идентификатор отслеживания сайта в Google Analytics и тип отслеживания – «Просмотр страницы»

    Рисунок 12

    Идентификатор отслеживания ресурса можно посмотреть в настройках Google Analytics.

    Рисунок 13

    5. Укажите триггер «All Pages»

    Чтобы тег срабатывал на всех страницах, укажите триггер «All Pages».

    Рисунок 14


    6. Сохраните внесённые данные

    Рисунок 15


    7. Укажите имя тега и нажмите на кнопку «Сохранить»

    Рисунок 16


    8. Проверьте корректность работы тега

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

    Рисунок 17

    В «Предварительном просмотре» контейнер с изменениями будет доступен только в вашем браузере.

    Если контейнер отобразился под строкой «Tags Not Fired On This Page», тег на странице не сработал. Необходимо проверить все настройки и при необходимости исправить допущенные ошибки.

    Если контейнер появился под строкой «Tags Fired On This Page», значит, Universal Analytics установлен без ошибок.

    Рисунок 18


    9. Опубликуйте Universal Analytics

    Рисунок 19

    Таким образом, мы подключили на сайт Google Analytics через GTM без вмешательства в исходный код страниц.

    Подключение Яндекс Метрики через GTM

    Для подключения Яндекс Метрики выполните те же действия, что и для Google Analytics, но так как по умолчанию Яндекс Метрики в GTM нет, при выборе продукта укажите «пользовательский HTML».

    Рисунок 20

    В результате появится окно с пустым полем.

    Рисунок 21

    В эту HTML-форму необходимо вставить код счётчика вашей Метрики.

    Если на сайте уже установлена Яндекс Метрика, скопируйте код счётчика с исходного кода страницы. Если нет, ознакомьтесь с тем, как создать и настроить счётчик Яндекс Метрики .

    Обратите внимание! Как и в случае с Google.Analytics, код на сайте размещать не нужно. Полученный код при настройке Яндекс Метрики нужно скопировать и добавить в появившееся на предыдущем этапе окно «Пользовательский HTML».

    Рисунок 22

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

    Рисунок 23

    Если в режиме предварительного просмотра контейнер размещён под строкой «Tags Fired On This Page», значит, всё настроено верно. Если же контейнер показывается под строкой «Tags Not Fired On This Page», тег не сработал, скорее всего, при подключении была допущена ошибка.

    Рисунок 24

    После того как мы убедились в том, что тег в предварительном режиме сработал, нажимаем «Опубликовать».

    Таким образом, мы подключили на сайте Яндекс Метрику без вмешательства в исходный код страниц.

    Если на вашем сайте ещё не установлен GTM, вы сможете установить и настроить его, следуя нашим инструкциям. А мы, в свою очередь, продолжим писать о том, как с помощью GTM анализировать трафик, конверсии и поведение пользователей.