Есть еще проще вариант. Использовать библиотеку jQuery. Тогда конструкция будет иметь вид:
Рис. 546. Используем jQuery и функцию .html()
Функция .html (newHTML) в jQuery заменяет содержимое всех выбранных элементов на newHTML. В нашем примере она заменяет содержимое значение заголовка на переменную podmeniZag, которая содержит значения в таблице поиска.
Есть и такой вариант. Использовать метод querySelector(). Он возвращает первый элемент, который соответствует указанному CSS-селектору в документе.
Рис. 547. Метод querySelector()
В теге мы выбираем условие активации триггера undefined и сохраняем тег.
Рис. 548. Условие активации тега – undefined
Проверяем корректность работы в режиме предварительного просмотра.
Рис. 549. Тег не сработал, переменной utm_content нет
Если мы переходим без метки в адресной строке, то тег не активируется и заголовок не подменяется. Все правильно. Давайте добавим к нашему url метку utm_content=zag3.
Рис. 550. Заголовок 3: Получите СРО «под ключ» за 666 дней! Работаем по всей России!
Тег сработал
Тег с меткой сработал, значение заголовка поменялось. Убедимся еще один раз. Теперь введем utm_content=zag4.
Рис. 551. Заголовок 4: Никогда не получите СРО! Мы не работаем в принципе! Тег сработал
Все работает корректно. Публикуем контейнер GTM и радуемся подменам.
С помощью GTM вы можете настраивать правила, при котором на сайте будут подменяться не только заголовки, но и подзаголовки, номера телефонов в зависимости от источника переходов, изображения и многое другое.
Однако все же лучший способ реализации динамического контента на сайте – это серверная сторона (через тот же .php), а не браузерная, поскольку различные манипуляции с DOM могут привести к замедлению загрузки страницы у пользователя, да так, что он увидит эту подмену на сайте.
Допустимо использование такого приема в небольшом проекте (лендинге, несколько страничном сайте) и на малом объеме трафика (до 50–100 посетителей в день). Но если ежедневное количество пользователей гораздо больше, на сайте много заголовков и подмен, то рекомендуется реализовать все это через backend.
В заключение
Вот и подошло к концу первое в русскоязычном сообществе электронное руководство по самому популярному диспетчеру тегов Google Tag Manager. Мы постарались добавить в него самые важные навыки и знания, которые будут необходимы вам в процессе работы.
Обе части (теоретическая и практическая) подробно изложены и разобраны с примерами и скриншотами. Все, что необходимо делать – это просто читать, делать, читать снова, переосмысливать, и снова делать. Только так можно разобраться в чем-то новом и неизведанном. Ну и должно пройти какое-то время, чтобы началась адаптация и привыкание. Продукты Google в этом плане не исключение.
К тому же, если заложить основы работы с GTM получилось даже у меня за полгода (хотя бы на уровне «новичок»), то почему не сможете вы? Я в вас верю!
Практическая часть составлена из примеров, которые встречались команде GaSend и мне во время работы с различными проектами. Разумеется, в главе 3 разбирается лишь 5% от возможностей диспетчера тегов Google. Однако не стоит забывать, что данное электронное руководство является достоянием всемирной паутины и каждого интернет-маркетолога и веб-аналитика в мире.
Вы также можете принять участие в расширении примеров этой книги. Просто присылайте материалы мне на почту [email protected] и свое согласие на публикую в следующей версии «Google Tag Manager для googлят: Руководство по управлению тегами» И это будет сделано!
Увидимся в следующих изданиях и на моих вебинарах!
Понравилась книга? Подписывайтесь на мои социальные сети:
● Vk.com – vk.com/ya.osipenkov
● Facebook.com – facebook.com/osipenkov.ru
● Instagram.com – instagram.com/yakov.osipenkov
● Telegram: t.me/osipenkovru
До встречи в январе 2019
