NetPeak Biz Tech    


Google Tag Manager: актуальные и неочевидные фишки

Google Tag Manager: актуальные и неочевидные фишки

< >

Google Tag Manager — система, cозданная Google для управления тегами JavaScript и HTML, которые используются для отслеживания и анализа данных на сайтах. При работе с GTM часто упоминается термин dataLayer и в этой статье мы разберемся, что это и в чем его особенности. А еще мы узнаем, как отслеживать статистику в Google ***ytics для SPA-сайтов и лендингов.

Что такое dataLayer

DataLayer — это название переменной JavaScript. Она служит для передачи данных, которые Google Tag Manager не может получить сам. Стоит заметить, что вместо dataLayer некоторые используют термин «уровень данных». Связано это с тем, что при необходимости можно переопределить название массива dataLayer на другое допустимое.
Например:

<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-XXXXXX\\\');script>

Код с переименованным именем уровнем данных:

<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\\\',\\\'dataNetpeak\\\',\\\'GTM-XXXXXX\\\');script>

 Разница между dataLayer = [] и dataLayer.push ()

Важно понимать, что при объявлении переменной dataLayer = [] в памяти создается новая переменная dataLayer, которую система определяет как пустой массив. Это значит, что если мы изменим значение массива, второе присваивание перезапишет первое:

<script> dataLayer = [{ \\\'businessSomeVar\\\' : \\\'businessSomeVal\\\' }]; script> ….. <script> dataLayer = [{ \\\'anotherSomeVar\\\' : \\\'anotherSomeVal\\\' }]; script>

 

При этом доступ есть только к anotherSomeVar, а к businessSomeVar доступа больше нет.

Также хочу обратить внимание на то, что объявление уровня данных с помощью знака «=» будет корректно работать только, если код будет размещен до кода GTM.

Особенности dataLayer.push ()

Метод push () имеют все массивы по умолчанию. Его особенность в том, что при вызове push () вы добавляете данные в массив в виде нового значения, то есть значения не перезаписываются, как в случае dataLayer =, а просто к ним добавляется еще одно.

Работая с Google Tag Manager, всегда необходимо использовать dataLayer.push () в следующей конструкции:

<script>window.dataLayer = window.dataLayer || []; dataLayer.push ({...});script>

Первая строка проверяет, был ли определен dataLayer. Если нет — он будет определен как новый пустой массив. В обоих случаях в него будут записаны данные.

Настройка веб-аналитики на одностраничных приложениях

Давайте поговорим о том, как с помощью GTM настроить корректное отслеживание данных в Google ***ytics для одностраничных приложений.

Как сделать SPA-сайты SEO-Friendly? Одностраничное приложение (Single Page Application, SPA) — это веб-приложение, использующее единственный HTML-документ как оболочку для всех веб-страниц. Все необходимые данные подгружаются в него динамически при помощи AJAX-запросов на сервер.

Из-за своих особенностей SPA-код Google ***ytics сработает только один раз при загрузке страницы. Стандартные способы настройки Google ***ytics нам не помогут, но эту проблему можно легко решить с помощью создания дополнительного триггера в GTM.

В Google Tag Manager нужно создать триггер «History Change» и выбрать тип триггера «Изменение в истории» — он отслеживает изменение истории браузера.

Затем применяем созданный триггер «History Change» к тегу для просмотра страниц «Universal ***ytics».

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

Этот вариант подходит для сайтов, у которых прописан человекопонятный URL. Если URL содержит знак # (хэш), символы после знака # называются фрагментами URL-адреса.

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

Фрагмент URL в Google ***ytics невозможно отследить по умолчанию, но с GTM нет ничего невозможного.

Для этого нам нужно выполнить следующие действия:

1. Настройка переменных

В Google Tag Manager нужно перейти в раздел «Переменные» выбрать «Настройки» и отметить значения «New History Fragment» и «History Source».

«New History Fragment» хранит новые фрагмент URL-адреса, когда он изменяется, а «History Source» позволит указывать то, что изменения в истории будут проверяться.

Далее, создаем переменную с собственным кодом JavaScript. Она будет производить новый, сформированный URL, который затем можно отправить в Google ***ytics в качестве пути к странице фрагмент URL-адреса. Называем ее «Get path with fragment» и добавляем следующий код:

function() { return window.location.pathname + window.location.search + window.location.hash;}

Эта переменная, добавленная в поле страницы, вернет путь, строку запроса (если она есть) и хеш URL.

2. Создание триггера

Необходимо создать триггер «History fragment change», выбрать тип триггера «Изменение истории» и условия активации в режиме «\"History Source\" равно popstate». Событие popstate вызывается, когда меняется активная запись истории. Мы используем popstate в качестве условия, чтобы он отключился в тех случаях, где может сработать триггер изменения истории.

3. Настройка тега

В обычный тег просмотра страницы (у меня он называется «Universal ***ytics»), в дополнительных настройках необходимо добавить новое поле «Page» и выбрать созданную нами пользовательскую переменную из первого пункта {{get path with fragment}}.

Далее, добавляем триггер «History fragment change», сохраняем тег и проверяем его работу.

4. Как это работает

Когда кто-то нажимает на ссылку, которая имеет привязку в href, например Contact Us, браузер отправляет событие изменения истории и оно подхватывается триггером «History fragment change». Это приводит к тому, что тег «Universal ***ytics» снова сpaбатывает.

Выводы

  1. В любом случае используйте dataLayer.push () — так вы добавляете данные в массив в качестве нового значения, а не перезаписываете старое, как в случае с методом использования знака «=».
  2. Для корректного сбора и передачи данных в Google ***ytics из SPA-сайтов с человекопонятным URL в GTM нужно создать триггер изменения в истории. Если в ваш URL содержит хэш, нужно просто добавить свою пользовательскую переменную в тег и заменить в триггере условие активации на «\"History Source\" равно popstate».

Если вас заинтересовал материал и вы хотите уточнить детали, добро пожаловать в комментарии.



Комментарии:

О рекламе в Telegram — что пошло не так

О рекламе в Telegram — что пошло не так Если вы автор телеграм-канала, то стоит задуматься об альтернативных контент-платформах. Мнение...

08 06 2026 2:12:31

16 советов для продуктового бизнеса от спикеров конференции SaaS Nation

16 советов для продуктового бизнеса от спикеров конференции SaaS Nation Истории бизнеса и советы от Игоря Жаданова (Readdle), Александра Галкина (Competera) и Рагнара Саас (Pipedrive)...

07 06 2026 22:35:59

Выбираем сайты-доноры: на что нужно обращать внимание

Выбираем сайты-доноры: на что нужно обращать внимание Ссылка с сайта с высоким тИЦ уже не считается качественной. Хороший донор вычисляется по комплексу факторов. Большую часть работы придется делать вручную. Важно найти отличный сайт, с огромным количеством интересного контента, оцененного по достоинству читателями, и гармонично туда вписать свою статью со ссылкой...

06 06 2026 3:42:27

Интернет-торговля в Украине: 15 слайдов о ecommerce

Интернет-торговля в Украине: 15 слайдов о ecommerce Тема поста — исследование электронной коммерции в Украине: рынки, статистика, объем продаж, поисковый потенциал....

05 06 2026 15:44:36

Инсайты Google Business Profile: от настройки до оптимизации

Инсайты Google Business Profile: от настройки до оптимизации Как зарегистрироваться и пользоваться аккаунтом в Google Business Profile: руководство для интернет-маркетологов и владельцев бизнеса...

04 06 2026 5:10:43

Как отписаться от рассылки SMS

Как отписаться от рассылки SMS Как бесплатно отключить смс уведомление. Плюс — подсказки для маркетологов: как снизить негативное отношение к бренду. То есть, как красиво предоставить возможность отписаться от смс клиентам, и не слить бюджет на ненужные сообщения. Узнать больше!...

03 06 2026 13:46:59

Как делать вирусный контент без лишнего текста — правила жизни Coub

Как делать вирусный контент без лишнего текста — правила жизни Coub Пользователи могут смотреть вирусные ролики без единого слова...

02 06 2026 17:33:58

Какие товары загружать на маркетплейсы — аналитика Hubber

Какие товары загружать на маркетплейсы — аналитика Hubber Специалисты дропшиппинг-платформы делятся данными по самым продаваемым товарам на крупных онлайн-площадках. Информация для масштабирования бизнеса. Читать!...

01 06 2026 11:49:50

Примеры лучших страниц оформления заказа интернет-магазинов

Примеры лучших страниц оформления заказа интернет-магазинов Корзина интернет-магазина поможет повысить продажи, если ее функционал содержит: фото товара, кликабельное наименование товара, перечень способов оплаты. Узнать больше!...

31 05 2026 19:20:33

Хакерская атака на постаматы: как человек становится заложником технологий

Хакерская атака на постаматы: как человек становится заложником технологий Хакерские атаки с развитием технологий коснулись постаматов и доставки заказов из интернет-магазинов...

30 05 2026 20:55:54

Продвинутые способы аналитики кампаний на Facebook — Инспектор и внутренние диаграммы

Узнайте, как пользоваться Инспектором и внутренними диаграммами Facebook, чтобы быть в лидерах своей ниши!...

29 05 2026 5:37:57

Есть идея для бизнеса. С чего стоит начать?

Есть идея для бизнеса. С чего стоит начать? Руководство к действию от основателя Netpeak Group....

28 05 2026 3:18:39

Как сделать хороший скриншот

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

27 05 2026 5:18:50

Как настроить динамические объявления в Яндекс.Директ

Объясняем по пунктам, как создать и правильно настроить DSA c таргетингом на фид и содержание сайта...

26 05 2026 4:29:17

Почему мы так говорим — из истории устойчивых выражений

Почему мы так говорим — из истории устойчивых выражений Об истории и значении поговорок и других фразеологических оборотов...

25 05 2026 17:54:34

Как настроить автоматические правила в Facebook? Подробное руководство

Как настроить автоматические правила в Facebook? Подробное руководство Правила Facebook позволяют пользоваться автоматизированным контролем над эффективностью рекламы. Читайте, как уменьшить количество ручной работы с помощью автоматических правил...

24 05 2026 5:33:32

Сколько стоил клик в Google Ads во втором квартале 2016 — исследование Netpeak

Сколько стоил клик в Google Ads во втором квартале 2016 — исследование Netpeak Алексей Селезнев проанализировал более 7 миллионов кликов и посчитал, во сколько обходятся рекламодателям клики по объявлениям в разных странах и тематиках....

23 05 2026 9:16:59

Сравнение Ringostat и Binotel. Комментируют PPC-специалисты

Сравнение Ringostat и Binotel. Комментируют PPC-специалисты Ringostat и Binotel. Сравнение главных сервисов для коллтрекинга в Украине...

22 05 2026 14:44:14

Влияние ссылок из социалок на ранжирование в поисковиках

Влияние ссылок из социалок на ранжирование в поисковиках Выдержка из интервью Дэнни Салливаном с представителями компаний Google и Bing...

21 05 2026 23:47:14

Рейтинг CPA-сетей в Украине — лучшие партнерки по мнению читателей

Рейтинг CPA-сетей в Украине — лучшие партнерки по мнению читателей Лидеров определили открытым голосованием. В ТОП-списки вошли CPA-сети, которые набрали больше всего голосов суммарно и по отдельным критериям....

20 05 2026 2:15:45

«Лучший питч — продукт, клиенты и доходы». Интервью с Виталием Гончаруком о маркетинге Augmented Pixels

«Лучший питч — продукт, клиенты и доходы». Интервью с Виталием Гончаруком о маркетинге Augmented Pixels СЕО of Augmented Pixels рассказал нам о принципах ведения бизнеса в Украине и США, о ненужности бизнес-планов и креативных питчей, а также о способе стать лучшим программистом...

19 05 2026 3:51:27

Семь массовых сбоев, оставивших миллионы людей без привычных сервисов

Семь массовых сбоев, оставивших миллионы людей без привычных сервисов Пожар в дата-центре, неудачные обновления и то самое падение Facebook....

18 05 2026 10:24:59

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

Аналитический инструмент для сервиса заказа билетов — контролируем бюджеты сотен мероприятий в реальном времени Как автоматизировать целый участок в работе комaнды специалистов по контекстной рекламе — кейс concert.ua...

17 05 2026 13:37:27

Сколько стоил клик в Google Ads в Казахстане в первом квартале 2020 года — исследование Netpeak

Сколько стоил клик в Google Ads в Казахстане в первом квартале 2020 года — исследование Netpeak Важно: понимания стоимость конверсии и необходимое количество конверсий, вы можете прогнозировать, сколько денег на рекламу нужно выделить. Вот почему вам может быть полезно это исследование. Читать....

16 05 2026 22:35:34

Краткое пособие для новичков по типам рекламных кампаний в Google Ads

Краткое пособие для новичков по типам рекламных кампаний в Google Ads Google Adwords: типы рекламных кампаний и объявлений, тонкостях настройки... Все, о чем вы боялись спросить... Или не боялись, а просто не знали, о чем спрашивать....

15 05 2026 20:31:15

Подмена текста с помощью GTM — как быстро изменить контент на сайте

Подмена текста с помощью GTM — как быстро изменить контент на сайте Если вам нужно быстро изменить небольшой объем контента на сайте без доступа к CMS, можно воспользоваться GTM. Как именно, читайте дальше....

14 05 2026 22:27:10

Как удалить себя из социальных сетей

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

13 05 2026 6:16:43

Как настроить расширенную электронную торговлю с помощью Google Tag Manager

Как настроить расширенную электронную торговлю с помощью Google Tag Manager Как GTM помогает настроить расширенную электронную торговлю (enhanced ecommerce)....

12 05 2026 21:13:31

Работа с автоматическими типами кампаний на Facebook

Работа с автоматическими типами кампаний на Facebook Как вести рекламные кампании и что делать на разных этапах настройки. Делимся опытом: примерами, кейсами и рекомендациями. Узнать больше и настроить свои РК, как боженька!...

11 05 2026 4:37:12

Коммуникация брендов на карантине: хорошие примеры SMM и PR

Что постить предпринимателям в соцсетях. Несколько примеров уместной работы SMM- и PR-специалистов, которые прямо и четко помогают озвучить позицию бизнеса в период карантина. Узнайте больше, чем действовать правильно!...

10 05 2026 13:38:40

Как email-рассылки принесли ceкc-шопу 20% дохода

Как email-рассылки принесли ceкc-шопу 20% дохода Кейс выполнимой миссии — отправили рассылку по «холодной» базе и обошли запреты почтовых сервисов на изображения 18+...

09 05 2026 11:25:34

Как добавить статью о проекте на Википедию: Slando for Wiki

Как добавить статью о проекте на Википедию: Slando for Wiki О том, как добавить статью в Википедию и о правилах, которые нужно выполнить, чтобы ее не удалили: от добавления Интервики до ссылок на другие статьи, специальных терминов, добавления страниц в категории и выбора источников. Узнать больше!...

08 05 2026 4:42:59

Что такое макет сайта и для чего он нужен

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

07 05 2026 18:58:24

Как бизнесу сэкономить на digital-услугах в кризис: 6 рабочих способов

Как бизнесу сэкономить на digital-услугах в кризис: 6 рабочих способов Разбираем на примерах коллабораций, подрядчиков из регионов и тендендерных площадок...

06 05 2026 14:16:14

Как настроить отправку писем с помощью языка R

Как настроить отправку писем с помощью языка R и как избежать подводных камней....

05 05 2026 6:41:49

10 творческих задач на собеседовании Wieden+Kennedy в интернете

10 творческих задач на собеседовании Wieden+Kennedy в интернете 10 заданий, которые заставят пошевелить мозгами и придумать нестандартные решения. Используйте их (видоизмените, адаптируйте) под свой продукт или услугу. Создайте крутую кампанию, креатив или предложите это своей комaнде....

04 05 2026 14:49:53

Редизайн писем в email-маркетинге — на что обратить внимание

Иногда даже замена блока с промокодом или обновление хедера и футера способны освежить рассылки и принести продажи, заявки, повысить лояльность клиентов. Узнать больше!...

03 05 2026 23:10:14

Продвинутый подход к работе с аудиториями Facebook

Продвинутый подход к работе с аудиториями Facebook В основе продвижения любых продуктов фигурирует ЦА и её потребности. Рассказываем, как с ней работать в разрезе Инстаграм и Facebook так, чтобы РК давала максимальный профит...

02 05 2026 8:29:32

Руководство для брендов по Playable Ads

Руководство для брендов по Playable Ads Рассказываем о перспективном формате рекламы, который привлекает внимание потребителя даже в эпоху повсеместной «баннерной слепоты»....

01 05 2026 10:26:30

Пасхалки Google — интересные и полезные возможности поисковика, о которых вы не знали

Пасхалки Google — интересные и полезные возможности поисковика, о которых вы не знали Забавные и полезные штуки от Google и как их найти...

30 04 2026 11:37:49

Чем наш PPC-отдел круче остальных?

Чем наш PPC-отдел круче остальных? Мария Гoлyб устала отвечать на вопрос «Какие преимущества PPC-отдела в Netpeak?» и решила написать об этом пост....

29 04 2026 4:32:13

10 шагов к статистике на блюдечке. Инструкция по настройке «Подсказок» в Google ***ytics 4

10 шагов к статистике на блюдечке. Инструкция по настройке «Подсказок» в Google ***ytics 4 Как с помощью GA4 анализировать рекламные кампании, лежа на диване...

28 04 2026 0:43:54

8 сервисов автопроверки on-page ошибок

Платные и бесплатные способы ускорить оптимизацию....

27 04 2026 23:37:21

Как модель маркетплейса увеличивает SEO-трафик?

Как модель маркетплейса увеличивает SEO-трафик? Каким образом бизнес-модель маркетплейса может помочь увеличить трафик интернет-магазина в целом....

26 04 2026 21:33:42

Алгоритм LSA для поиска похожих документов

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

25 04 2026 8:28:14

Аналитика покупок американцев и украинцев перед праздниками

Аналитика покупок американцев и украинцев перед праздниками Пост о том, как и когда тратит деньги американский и украинский покупатель...

24 04 2026 15:27:28

Блог Netpeak 2.0 — мы всё поменяли, и вот почему

Блог Netpeak 2.0 — мы всё поменяли, и вот почему Блог на новом движке и с новым дизайном, перетянувший в себя огромное количество постов и комментариев за Х лет своей работы...

23 04 2026 2:41:55

Email моей мечты, или Как настроить корпоративную почту

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

22 04 2026 8:42:48

Кейс по продвижению интернет-магазина медицинских товаров: ROMI 32%

Кейс по продвижению интернет-магазина медицинских товаров: ROMI 32% Продвигаем медицинский проект. Кроме цифр рассказываем, что и как делали...

21 04 2026 22:57:14

Группировка ключевых фраз для рекламных кампаний — подробный обзор методов

Группировка ключевых фраз для рекламных кампаний — подробный обзор методов Как правильно группировать ключевые фразы для релевантности рекламных кампаний...

20 04 2026 6:37:23

Еще:
понять и запомнить -1 :: понять и запомнить -2 :: понять и запомнить -3 :: понять и запомнить -4 :: понять и запомнить -5 :: понять и запомнить -6 :: понять и запомнить -7 ::