6308 https://ppc.world/uploads/images/b5/57/5cf7cd02451f1-chess-1215079-1280-1.jpg 2019-06-06 ppc.world 160 31

Подстановка ключевой фразы в заголовок сайта через GTM — инструкция

Веб-аналитик в Demis Group Михаил Романцов подробно описал, как с помощью 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 в ссылки объявлений.

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: