Подставляем в GTM ключевую фразу, по которой был переход из объявления Яндекс.Директа или Google.Ads, в заголовок сайта.
В этом материале мы разберем решение для Google Tag Manager, которое позволит подставлять значение utm_term в заголовок сайта.
Как и зачем мы будем это делать? Мы возьмем значение динамического параметра {keyword}, т. е. ключевую фразу, по которой был переход из объявления Яндекс.Директа или Google Ads, и подставим его в заголовок сайта. Так, мы увеличим релевантность посадочной страницы для пользователя и, вероятно, повысим показатель конверсии. По крайне мере, такую динамику мы видим у наших клиентов.
Подготовка переменных
Подмена заголовка на сайте будет происходить при появлении в url параметра utm_multi с значением ON Почему так? Так будет проще при необходимости точечно включить подмену или точечно выключить ее для определенных объявлений, групп или кампаний. То есть в любой момент можно удалить этот параметр из ссылки и подмена прекратит работать — это практично.
Создаем в GTM переменную, которая будет принимать значение динамического параметра {keyword} — в Директе такой используют для utm_term. Получать это значение в GTM возможно, создав переменную типа URL, с типом компонента «Запрос» и ключом запроса «utm_term»:
Теперь создадим переменную типа URL с типом компонента «Запрос», ключом будет специально придуманный параметр «utm_multi» (у вас может быть другой):
В дальнейшем значение «ON» у этой переменной будет являться триггером для тега, который так важен.
Тег, который так важен
Это будет пользовательский HTML-тег, в котором будет размещен вот такой скрипт:
<script>
jQuery('h2').contents().replaceWith('{{utm_term}}');
</script>
где {{utm_term}} — переменная, которую мы ранее создали;
h2 — заголовок, который будет подменяться.
Вообще элемент для подмены может отличаться в зависимости от проекта и задач, которые необходимо решить. Идентификация элемента, который нужно подменить, происходит так: наводим мышку на элемент, нажимаем правую кнопку мыши и далее — «Проверить элемент».
Например, если бы нужно было подменить текст на этой кнопке (см. картинку), то в скрипте вместо h2 фигурировало бы button:
<script>
jQuery(‘button’).contents().replaceWith('{{utm_term}}');
</script>
Важно: подменяться будут все элементы с указанным в скрипте тегом — все h2 (или все button). Задать порядок можно с помощью селектора, который ограничит область поиска элемента на основе его позиции:
- :last — для выбора последнего элемента:<script> jQuery(‘h2:last’).contents().replaceWith('{{utm_term}}'); </script>
- :first — для выбора первого элемента:<script> jQuery(‘h2:first’).contents().replaceWith('{{utm_term}}'); </script>
- :gt() для выбора элемента с заданным индексом.Тут у первого элемента индекс равен 0, то есть чтобы обратиться только за вторым h2 нужно будет использовать индекс 1:
<script> jQuery(‘h2:gt(1)’).contents().replaceWith(’{{utm_term}}’); </script>
Про скрипт тега — всё. Осталось добавить триггер по которому будет активироваться этот скрипт. По плану — когда у utm_multi будет значение ON. Делаем триггер типа «Просмотр страницы» — «Некоторые просмотры страниц», для которых переменная «multi» будет равняться «ON»:
Готово. Осталось опубликовать все это дело, причесать ключевые фразы в рекламных кампаниях и добавить &utm_multi=ON в ссылки объявлений.