Денис Герасимов

Google Tag Manager

Заставка к видео - Google Tag Manager

Здравствуйте, с вами Денис Герасимов и сегодня мы с вами поговорим об очень интересном инструменте Google Tag Manager.

Этот инструмент я начал применять относительно недавно, но он меня порадовал своими возможностями и функционалом. Tagmanager– специальный контейнер, который мы устанавливаем на сайт и в этот контейнер мы уже можем подгружать, например, Яндекс Метрику, google analytics и взаимодействовать с кнопками и формами на сайте посредством JavaScript, с помощью определенных тегов.

Преимущества Google Tag Manager

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

Когда мы перейдем на главную страницу сайта, вы увидите, как раз эту главную идею. Занимайтесь маркетингом без IT специалистов. Все это бесплатно.

Как работает GoogleTagManager?

google tag managerПринцип данного инструмента очень простой. Мы вставляем контейнер в код сайта, как обычную метрику или Гугл аналитикс, если вы их уже устанавливали. И этот контейнер подгружает уже с серверов Гугл, тот код, который мы хотим, чтобы был подгружен, при определенных правилах. Например, мы хотим, чтобы код был подгружен только на страницах корзины или оплаты товара. В интерфейсе все это настраивается. Код контейнера не видно, работает все быстро и точно, как часы.

И сегодня мы установим код контейнера на сайт, и я вам покажу, как в него в тег менеджер установить Гугл аналитикс и Яндекс Метрику.

Инструкция по установке Метрики и Аналитикс на сайт с помощью Google Tag Manager

Нам необходимо зарегистрироваться в google tag manager, нужно завести аккаунт. В аккаунте создать контейнер. То есть мы в одном инструменте Гугл тэг менеджер можем создать несколько аккаунтов. Как в аналитиксе, если вы с ним работали, там тоже можно создавать несколько аккаунтов, к ним подключать разные сайты, затем разные представления делать. В аналитиксе можно еще доступ давать. После того как создадим контейнер, установим его на сайт и потом уже установим аналитику и метрику на наш сайт. Естественно, чтобы их установить, нужно создать эти счетчики.

Давайте, начнем. Для этого перейдем по адресу google.ru/tagmanager/

Если у вас нет аккаунта нужно зарегистрироваться. Просит ввести адрес почты. У меня она уже есть. Вводим. Попадаем в следующий интерфейс, сейчас подгрузится. И нужно назвать аккаунт. Давайте, назовем его Test, вы можете его как угодно назвать, это название ни на что не влияет. Нажимаем далее и создаем первый контейнер. Называйте его тоже как вам удобнее, я обычно ориентируюсь по домену. Вводим домен. Нужно отметить, что это веб страница или что у нас веб приложение. Если мы этого не отметим, нам интерфейс не даст перейти на следующий шаг. При этом домен необязательно сюда вводить. Выбираем часовой пояс. И создаем аккаунт и контейнер. Нужно принять условия использования. Тут к сожалению русского языка, нет, но чтобы использовать данный инструмент, придется по любому принять условия. Я принимаю.

И вот мы получили код собственно контейнера google tag manager. Это все что нам нужно установить на сайт. Здесь есть маленькая инструкция. Скопируйте данный код и установите его на все страницах вашего сайта непосредственно после открывающегося тега <body>.

Копируем и вот у меня есть подготовленная страница. Находим тег <body> и после него устанавливаем код контейнера. Ctrl+V. Сохраняем и закачиваем страницу на сервер. И уже в этот контейнер google tag manager мы можем подгружать наши коды. Нажимаем тег позже, либо сразу можем установить тег google analytics, нажимаем вот сюда.

Назовем его особо не думая GA (google analytics). Тип тега выбираем GA – universal analytics. Вот он уже стоит. И нам нужно сюда добавить идентификатор отслеживания. Он берется в аналитиксе, когда вы создаете счетчик. То есть не нужно вставлять сюда весь счетчик, достаточно только идентификатор, он у меня уже есть, вот такой у него вид. Копируем его и вставляем его в это окно. Если мы поставим сюда галочку, то у нас будет создаваться теги ремаркетинга для АдВордс, которые мы сможем использовать в рекламе. Нам необходимо еще здесь сделать – активировать правила. Это правило, по которому у нас в контейнер будет подгружаться тег с кодом аналитикс. Естественно он нужен нам на всех страницах, выбираем все страницы и сохраняем. Все: правила у нас есть, тег ремаркетинга есть, идентификатор отслеживания мы установили, теперь сохраняем.

Таким образом, мы подготовили наш контейнер, в который вставляется код Гугл аналитикс.

Устанавливаем Яндекс Метрику в Google Tag Manager

Давайте вставим Метрику сюда, для этого у нас должен уже быть создан счетчик и код Яндекс Метрики. Нажимаем создать, выбираем тег. Называем его Метрика. И выбираем тип тега – пользовательский HTML. Можем сразу активировать правила. Чтобы код подгружался на все страницы. Сохранить. И уже вот сюда в это окно нужно вставить код Яндекс Метрики. Я его подготовил. То есть вам нужно создать счетчик отдельный внутри Яндекс Метрики и взять оттуда код, я его уже просто предварительно взял. Копируем и сюда вставляем. У нас таким образом установлена метрика.

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

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

Теперь наш контейнер опубликован и в него будут подгружаться коды Гугл аналитикс и Яндекс метрики. Если мы хотим что-то изменить или удалить, то мы легко можем это сделать, а затем нажать опубликовать. И вы увидите, что меняются цифры версий: 1, 2, 3, 4 и так далее.

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

Как настроить цели на события в GTM

Всего доброго, до свидания увидимся в следующих видео.

↓ Презентация cloud.mail.ru

Подпишитесь на YouTube канал

  • http://vk.com/id221696592 Евгений Шпанов

    СУПЕР!

  • Sasha

    Установил GTM, добавил тег Я. Метрики. В самой метрике информация о том, что код установлен успешно, показывает!Но статистику по визитам НЕ собирает!

    Где косяк?

    • https://rek9.ru Денис Герасимов

      1. Код контейнера опубликован?
      2. Правило подключения на все страницы сайта?
      3. Тег с метрикой Пользовательский HTML?
      4. Код обрамлен