Динамическая вставка на странице приземления
Как известно, пользователи любят, когда результаты их поиска максимально отвечают на их потребность. При покупке товара или услуги, для кого-то важна цена, для кого-то скорость доставки, а кто-то просто ищет самое лучшее предложение. И чтобы получить лучший результат, перефразируя известную поговорку — сегментируй или умри. Но плодить уйму разных вариантов под каждый сегмент достаточно затратно, и тут можно поступить проще.
В инструменте Google Tag Manager есть возможность изменять код сайта (тексты, картинки), используя функцию document.write() в тегах.
То есть, в зависимости от того, что пользователь написал в поисковом запросе, или на какой баннер он нажал, мы можем, на лету, уточнять контент на нашей посадочной странице.
В инструменте Google Tag Manager есть возможность изменять код сайта (тексты, картинки), используя функцию document.write() в тегах.
То есть, в зависимости от того, что пользователь написал в поисковом запросе, или на какой баннер он нажал, мы можем, на лету, уточнять контент на нашей посадочной странице.
Зачем это нужно?
Вот несколько примеров применения:
Регионы. Предположим, человек вводит в поиске — «купить авто в Киеве», и на странице приземления но может увидеть не просто заголовок «Лучшие авто в Украине», а персонализировано для своего региона — «Лучшие авто в Киеве».
Картинки. В зависимости от того, что написано в запросе, мы можем выводить разные изображения, которые более точно подходят под нужный сегмент.
Призыв к действию. Для каждого из нас важные разные вещи в процессе принятия решения о покупке, и мы пишем их в поисковых запросах. И если мы видим призыв к действию, который отвечает нашим потребностям, то желание совершить конверсию становиться просто непреодолимым.
Регионы. Предположим, человек вводит в поиске — «купить авто в Киеве», и на странице приземления но может увидеть не просто заголовок «Лучшие авто в Украине», а персонализировано для своего региона — «Лучшие авто в Киеве».
Картинки. В зависимости от того, что написано в запросе, мы можем выводить разные изображения, которые более точно подходят под нужный сегмент.
Призыв к действию. Для каждого из нас важные разные вещи в процессе принятия решения о покупке, и мы пишем их в поисковых запросах. И если мы видим призыв к действию, который отвечает нашим потребностям, то желание совершить конверсию становиться просто непреодолимым.
Как это сделать?
Проще простого! Нам нужны UTM метки, специальный тег и макрос в GTM.
utm-метка
В последнее время, большой популярностью пользуется автопометка в AdWords и Директе и понятно почему, это удобно, но никто не мешает нам поставить еще одну метку для наших целей.
Для AdWords немного сложнее, так как даже функция ValueTrack, не позволяет передавать точный поисковый запрос, который ввел пользователь.
Поэтому необходимо делить группы объявлений по группам, скажем по регионам, и добавлять к url, что то типа:
Для AdWords немного сложнее, так как даже функция ValueTrack, не позволяет передавать точный поисковый запрос, который ввел пользователь.
Поэтому необходимо делить группы объявлений по группам, скажем по регионам, и добавлять к url, что то типа:
&true_keyword={keyword}Для Яндекс Директа проще, так как он позволяет передавать точный поисковый запрос, который ввел пользователь, поэтому ко всем нашим объявлениям мы добавляем тоже самое, но без необходимости разделять на группы:
&true_keyword={keyword}Переменная в GTM
Цель переменной — поймать наш ключевой запрос и записать его в переменную GTM, с которой, в дальнейшем, мы сможем работать.
Чтобы его создать, нажимаем на большую красную кнопку — «Создать», и выбираем пункт «Переменная» и заполняем его, согласно картинке:
Чтобы его создать, нажимаем на большую красную кнопку — «Создать», и выбираем пункт «Переменная» и заполняем его, согласно картинке:
тег в GTM
Для начала делаем новый тег, типа «Пользовательский тег HTML», как-нибудь его называем и задаем правило gtm.dom (event=gtm.dom), должно получить что-то такое:
Где правило активации:
Дальше интересней, ищем нужный элемент на нашем сайте, который хотим поменять, для этого открываем нужную страницу, и если у вас Chrome, то нажимаем на него правой кнопкой мышки и нажимаем на пункт «Просмотр кода элемента», где появляется Developer Tools, где мы можем посмотреть id и class нужного нам элемента:
И пишем код, типа такого:
<script>
$( "div#main div.next div" ).text("НАЙДИ СВОЙ ТОВАР ИЛИ УСЛУГУ СЕЙЧАС!");
var str = {{true_keyword}};
if (str != ""){
if(str.indexOf('одежд') + 1) {
$( "div#main div.next div" ).text("Найдите лучшего поставщика ОДЕЖДЫ!");
$( "div.finish div.fixed div.feedback h3" ).html("Отправьте заявку, <br><br>найдите лучшего <br><br>поставщика ОДЕЖДЫ:");
}
if(str.indexOf('мед') + 1) {
$( "div#main div.next div" ).text("Найдите лучшего поставщика МЁДА!");
$( "div.finish div.fixed div.feedback h3" ).html("Отправьте заявку, <br><br>найдите лучшего <br><br>поставщика МЁДА:");
}
if(str.indexOf('мёд') + 1) {
$( "div#main div.next div" ).text("Найдите лучшего поставщика МЁДА!");
$( "div.finish div.fixed div.feedback h3" ).html("Отправьте заявку, <br><br>найдите лучшего <br><br>поставщика МЁДА:");
}
}
</script>Я не претендую на правильный коддинг, чтобы оно работало хорошо попросите своего js программиста.
Но чтобы облегчить вам жизнь, можете воспользоваться этой статьёй.
Но чтобы облегчить вам жизнь, можете воспользоваться этой статьёй.
Минусы
Как обычно, есть и обратная сторона медали, а именно:
- Во-первых, при больших изменениях нужен js программист, который корректно настроит скрипт;
- А во-вторых, изменения, появляются не сразу, а только после того, как страница полностью загружена, иногда это 1-2 секунды.
Заключение
С помощью этой возможности, вы можете давать пользователям то, чего они хотят, тем самым повышать конверсию. Google Analytics, при включенной автопометке может ругаться, но все данные будут корректно передаваться.
