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? Одностраничное приложение (
Из-за своих особенностей 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батывает.
Выводы
- В любом случае используйте dataLayer.push () — так вы добавляете данные в массив в качестве нового значения, а не перезаписываете старое, как в случае с методом использования знака «=».
- Для корректного сбора и передачи данных в Google ***ytics из SPA-сайтов с человекопонятным URL в GTM нужно создать триггер изменения в истории. Если в ваш URL содержит хэш, нужно просто добавить свою пользовательскую переменную в тег и заменить в триггере условие активации на «\"History Source\" равно popstate».
Если вас заинтересовал материал и вы хотите уточнить детали, добро пожаловать в комментарии.
Комментарии:
Один из лучших способов выбрать подрядчика — провести брифинг для компаний. При этом важно предоставить максимум информации: откройте доступ к реальным данным по проекту. Узнать больше!...
31 05 2026 8:42:39
Как добиться 100% пользы от контекстных объявлений с помощью расширений...
30 05 2026 17:31:52
Узнайте зарплату интернет-маркетологов с новым рейтингом от Serpstat....
29 05 2026 19:27:44
Google Shopping и Smart Shopping Campaign сами себя не оптимизируют....
28 05 2026 9:33:13
Где искать информацию, как составить контент-план, писать тексты быстро и легко, а затем продвигать их. Собрали для вас подборку постов о разных этапах работы с контентом....
27 05 2026 20:33:25
Стоит установить и освоить Google Tag Manager для расширения представления сайта в выдаче...
26 05 2026 12:17:51
Быстрый и бесплатный способ настройки целей через Google Tag Manager....
25 05 2026 11:55:31
Уроки, написанные понятным и доступным языком экспертами по контекстной рекламе, поисковому продвижению, SMM....
24 05 2026 10:37:31
Рекламные кампании для брендинга, роста вовлечения пользователей, продаж, лояльности. Какой формат выбрать, чтобы получить необходимое целевое действие. Узнать!...
23 05 2026 8:27:26
Делайте анализ ссылочной массы хотя бы раз в месяц — и будет вам счастье....
22 05 2026 6:10:57
Тошнота и процент воды в тексте не должны превышать допустимую норму, иначе не только пользователи уйдут с сайта, поисковые роботы понизят сайт в рейтинге. Узнать больше!...
21 05 2026 4:35:49
Сколько прибыли вы не получили в Google Ads из-за нехватки бюджета или низкого рейтинга ключевых слов. Метод покажется сложным, но в дальнейшем вы сможете бесплатно обновлять данные и контролировать потери показов и дохода по всем рекламным кампаниям...
20 05 2026 20:48:32
Почему в рекламе недвижимости стоит запускать динамический ремаркетинг...
19 05 2026 16:36:56
Сбор ключевых запросов с помощью программы Кей Коллектор: показываем и рассказываем пошагово с демонстрацией процесса настройки с сервисом Яндекс.Вордстат. Читать дальше!...
18 05 2026 20:56:34
Первое подробное руководство по работе с оконными функциями в Google BigQuery....
17 05 2026 21:23:24
Перевод статьи Никки Джиллиленд из Econsultancy об уроках для маркетологов про то, каким должно быть хорошее видео. Узнайте 4 правила эффективного видеоконтента прямо сейчас!...
16 05 2026 12:41:47
Чтобы попасть в админку сайта, необходимо определить, какая именно CMS используется. Для этой цели подойдет ручной анализ сайта и его HTML-кода, а также онлайн-сервисы...
15 05 2026 4:51:37
Особенности продвижения в нише аренды автомобилей по материалам кейсов наших коллег...
14 05 2026 14:23:30
О том как растут доходы при оптовой торговле женской одеждой и обувью, а траты на рекламу остаются на прежнем уровне...
13 05 2026 23:50:41
О том, какие результаты дает эта технология, рассказал Александр Иванов, Head of Product в ЛУН.ua в рамках прошлогодней самой летней конференции 8P. Читайте, как его комaнде удалось разогнать загрузку страниц сервиса Flatfy до 0,2 секунды...
12 05 2026 21:16:51
Зачем нужны пользовательские сегменты клиентов и как их создавать — читайте в завершающей части серии «Как анализировать эффективность рекламы в Google ***ytics?»...
11 05 2026 4:54:20
Перед обращением за услугами продвижения задайте себе вопрос: готов ли я выделить львиную долю своего времени и сил на серьезное развитие проекта? При отрицательном ответе не стоит и начинать. И другие вопросы о SEO-продвижении...
10 05 2026 12:14:48
Четкий мануал для настройки Яндекс.Аудиторий от создания сегмента, работы с геолокацией, пикселем аудитории, похожими аудиториями, ретаргетингом и до корректировки ставок...
09 05 2026 2:43:29
Динамический ремаркетинг — один из самых эффективных способов продаж для любой группы товаров. В этой статье мы поделимся тонкостями технической подготовки к запуску динамического ремаркетинга в Facebook....
08 05 2026 6:42:15
Перед внедрением ремаркетинга следует хорошенько поработать над составлением базовых портретов аудитории сайта...
07 05 2026 12:56:50
Решили написать про новый формат рекламы — баннерный...
06 05 2026 3:32:59
Простой способ отслеживания как внутренних, так и внешних битых ссылок. Узнать больше!...
05 05 2026 16:22:51
Подборка онлайн-платформ и программ для работы с текстом и изображениями....
04 05 2026 4:45:52
Для работы в интернет-маркетинге нужно хорошо разбираться в аналитике. Рассмотрим, как использовать в работе Google ***ytics 4 и чем он отличается от Universal...
03 05 2026 3:39:29
Как построить html-карту. Верстка карт New York Times, IMDb и Daily Mail в качестве примера...
02 05 2026 2:20:36
Кейс роста трафика из органического поиска на 200%....
01 05 2026 18:55:50
Краткая инструкция по работе с обратной связью: как правильно просить и получать отзывы. Они напрямую влияют на бизнес, увеличивают конверсию и выгодно выделяют вас на фоне конкурентов. Как это использовать? Читайте дальше!...
30 04 2026 20:38:56
Полезный и интересный контент — это лучший крючок, который помогает привлечь новых клиентов на аграрном рынке и удержать их внимание....
29 04 2026 4:38:15
Чат-боты упрощают процесс покупки продуктов онлайн. Netflix, Adidas, British Airways и другие крупные компании уже внедрили ботов в свои маркетинговые системы. Так ли это эффективно, если компании начинают отказываться от операторов в пользу ботов?...
28 04 2026 20:48:11
10 шагов к я-бренду из книги «Я-бренд. Формула успеха». Марк вырастил свой бренд до размеров торгового бизнеса с объемами продаж в миллиарды долларов. Читайте, здесь есть и сама формула, подходящая для товара, сайта или торговли машинами...
27 04 2026 7:43:25
Как делать большие деньги даже, когда случаются кассовые разрывы и каким образом строить процессы внутри компании, чтобы сотрудники горели своим (вашим) делом? Узнать!...
26 04 2026 4:42:30
Как понять, что проект нуждается в новых текстах и сделать читателя счастливым...
25 04 2026 14:10:36
Сайту нужны внешние ссылки на сторонних ресурсах. Они могут повлиять на ранжирование вашего ресурса и трафик, а один из методов их получить — аутрич....
24 04 2026 11:37:32
Распределение бюджета на кампании в Google Рекламе. Обозревает Григорий Крутий....
23 04 2026 10:17:45
Помимо полезного и качественного продукта, услуги, компании нужен мощный маркетинг. И возможно это только благодаря хорошему директору по маркетингу. Только так это работает. Кто лучшие в этой нише в Казахстане? Узнать!...
22 04 2026 11:31:57
Контент может информировать, вовлекать и продавать, при этом для каждой цели нужен свой тип контента...
21 04 2026 21:36:41
Есть ли шанс на апелляцию...
20 04 2026 7:21:41
Оживший бар. О том, как один украинский бренд за полтора месяца получил более 4 000 фанов!...
19 04 2026 9:54:10
Как написать годный кейс и победить страх чистого листа...
18 04 2026 5:22:15
Как понять, что именно нравится подписчикам в вашей рассылке...
17 04 2026 22:16:23
Объясняем по пунктам, как создать и правильно настроить DSA c таргетингом на фид и содержание сайта...
16 04 2026 10:51:45
Какие типы кампаний и ключевых слов стоит первыми запускать в Google Рекламе? Советы новичкам...
15 04 2026 12:34:50
Десктопная версия, совместная работа (collabs), сбор средств и новые эффекты в Reels. Рассказываем, что дают новые функции. Узнать больше....
14 04 2026 10:38:28
Благодаря внедрению интеpaктивной формы подписки увеличили количество ежемecячных подписок на 100%, доход — на 51%, а коэффициент транзакций — на 71%....
13 04 2026 1:27:38
Стандартный образец для новичков. Форматы объявлений в РСЯ, чтобы начинающие специалисты по контекстной рекламе смогли быстро и эффективно запустить рекламные кампании. Интересно? Читайте дальше!...
12 04 2026 10:41:12
Еще:
понять и запомнить -1 :: понять и запомнить -2 :: понять и запомнить -3 :: понять и запомнить -4 :: понять и запомнить -5 :: понять и запомнить -6 :: понять и запомнить -7 ::
