Подмена города на сайте в Google Tag Manager (2018)

Приветствую, друзья! Это снова я – Евгений Тридчиков – и в этом видео мы продолжаем тему подмены контента на сайте с помощью Google Tag Manager. Сегодня разберем, как подменять город на сайте в зависимости от местоположения пользователя для трафика из Google Adwords. Лень читать? Смотрите видео в конце статьи!

В прошлом видео я рассказывал, как подменять заголовок на сайте. Если вы его видели, то ничего нового кроме динамических параметров в целом не узнаете. А если нет – вот вам пошаговая инструкция.

Пошаговый план

  1. Определяем параметр запроса
  2. Готовим таблицу подмен
  3. Настраиваем тег подмены в GTM

Самый простой вариант – разбить рекламные кампании на регионы, разметить трафик соответствующим образом и подменять местоположение на сайте по знакомому алгоритму. Но это громоздко для рекламного аккаунта и, согласитесь, неудобно (не будете же вы дублировать кампании для каждого города).

Динамические параметры местоположения ValueTrack

Поэтому для решения задачи обращаемся к динамическим параметрам ValueTrack. Нас интересуют параметры {loc_interest_ms} и {loc_physical_ms}. Ссылку на справочную информацию я прикладываю под видео.

{loc_interest_ms} – возвращает id региона, к которому пользователь проявил интерес, то есть указал в поисковом запросе.
{loc_physical_ms} – возвращает физическое местоположение пользователя, то есть id региона, в котором был получен клик.

Разница между ними в том, что {loc_physical_ms} всегда имеет значение. А {loc_interest_ms} может принимать неопределенное значение, потому что далеко не всегда пользователь использует геозапросы в поиске. Это важный момент, потому что при расширенном географическом таргетинге важно показывать на сайте актуальное местоположение для конкретного пользователя.

Пример: мы рекламируем компанию, которая оказывает услуги в Минске. При этом пользователь может искать подобные услуги, находясь в другом регионе, скажем Витебске. При таком сценарии {loc_physical_ms} примет значение для Витебска, а {loc_interest_ms} примет значение для города Минск. Какой город показывать на сайте в этом случае?

Конечно, Минск. Во-первых, местоположение пользователя может быть определено не верно. Во-вторых, житель Витебска может планировать поездку в Минск. А еще минчанин может находится в другом городе. Вариантов много.

Где взять айди регионов?

Хорошо. Но где взять айди регионов? Для этого отправляемся в раздел справочной информации Google Adwords для разработчиков. Здесь нас интересует таблица гео апи. С помощью простого фильтра сортируем таблицу для нужного региона, убираем лишние столбцы, выгружаем на компьютер.

Нас интересует столбец Criteria ID. Параметры ValueTrack, которые мы рассмотрели выше, возвращают значения, представленные в этом столбце. Это уникальные значения ID для каждого региона, известного Google Adwords на текущий момент.

Что ж, со значениями параметра мы разобрались, давайте дадим ему название. Не буду далеко ходить и возьму соответственно loc_physical и loc_interest. Я реализую подмену города на ресурсе elecson.pro и в таком случае ссылка может принимать следующий вид:

https://www.elecson.pro/?loc_interest={loc_interest_ms}&loc_physical={loc_physical_ms}

Никто не запрещает использовать ютм-разметку. А также взять для параметра любое название, например, dimabilan. Главное, чтобы ссылка содержала данные параметры ValueTrack.

Готовим таблицу подмен

Отправляемся в Excel и готовим таблицу подмен для своего удобства. Сейчас вы видите финальный вариант таблицы. В столбец ключ я поместил название параметра, в столбец значение я поместил айди региона, а в столбце текст указал конструкцию HTML, которая будет заменять значение соответствующего селектора на сайте. Об этом чуть позже.

Готовим таблицу подмен для подмены элементов на сайте
Составляем табличку для своего удобства, ну и вообще пора бы

В столбце ссылка содержатся варианты ссылок с параметром для каждого города. Это сделано для своего удобства, для быстрой проверки.

Супер, остался последний этап. Перемещаемся в аккаунт Google Tag Manager и начинаем собирать логику подмены.

Тип перемнной URL, ключ запроса utm контейнер

Для начала создаем 2 переменные типа “URL”, тип компонента “Запрос”, ключ запроса – вставляем название параметра, которое придумали на первом шаге. В моем случае это loc_physical и loc_interest, в вашем случае, повторюсь, это может быть dimabilan.

Сохраняем и даем понятное для себя название, например, “loc_interest – запрос”. Созданная таким образом переменная принимает значение параметра в ссылке. То есть айди региона.

Ключ запроса – переменная Value Track в ссылке

Далее создаем переменную типа “Таблица поиска”. В качестве входной переменной указываем название параметра. Заполняем поля согласно таблицы подмены, которую мы подготовили заранее. Сохраняем, даем понятное название.

Аналогично создаем таблицу поиска для второго параметра. Можно просто скопировать ее и поменять входную переменную. Таким образом, переменные типа “Таблица поиска” будут принимать значения, указанные в полях “Результат”, то есть названия местоположений. А зависит результат от значения входной переменной, то есть айди региона. Надеюсь, уловили логику.

Тег подмены для jQuery

А теперь самое интересное: давайте активируем тег подмены города для elecson.pro. На сайте установлена библиотека jQuery, поэтому я использую соответствующий скрипт. Разберем его.

Кавычки-елочки замените на простые двойные кавычки (стиль блока так отображает символы).

Как видите, jQuery ищет на сайте элемент с указанным селектором и делает “реплейс” его значения на значение указанной переменной, то есть Таблицы поиска. Две фигурные скобки означают, что речь идет про макрос, то есть динамическую переменную.

Что еще за селектор? Я не разработчик, но говоря простым языком, селектор это относительный путь к элементу в рамках HTML-документа. В моем случае местоположение на сайте указано в третьей строчке заголовка. Я выделяю его, жму правую клавишу мыши и выбираю “Исследовать элемент”.

Попадаю в панель разработчика, жму правую клавишу мыши и выбираю “Копировать селектор”. Это значение я и вставляю в скрипт для поиска нужного элемента.

Таблица подмен для заголовка

Как видите, друзья, в моем случае подменяемый элемент – это текст, заключенный в теги параграфа <p> </p>. Именно поэтому я использовал такой текст в формате HTML для таблицы подмены и для поля “Результат” в  переменной “Таблица поиска”. Думаю, с этим разобрались.

Конфигурация табличной переменной

А что делать, если на сайте нет jQuery? Ну, вариантом много, друзья. Вы можете добавить библиотеку самостоятельно. Вы можете попросить разработчика сделать это. Вы можете добавить ее с помощью диспетчера тегов. А еще вы можете использовать другой скрипт, который ищет элемент на сайте. Вопрос только в реализации, поэтому если вы как и я совсем не программист, просто покажите это видео разработчику.

Варианты активации тега

Хорошо, а что с триггером? Вы можете использовать стандартный триггер “Все страницы”, а можете сделать по-другому. Для того, чтобы тег срабатывал только для трафика из Adwords, в качестве триггера возьмем “Просмотр страницы”, а в качестве фильтра “Таблица поиска – loc_interest” не равно “undefined”.

“Undefined” – это неопределенное значение, которое принимает переменная, если параметр в ссылке пустой. Таким образом, тег сработает только для трафика с параметром loc_interest, который принимает определенное значение.

Триггер для трафика с разметкой

Аналогично настраиваем триггер для тега подмены по параметру loc_physical. Но не забудьте указать в качестве исключения триггер “Таблица поиска loc_interest определена”. Это нужно для того, чтобы подмена осуществлялась в первую очередь на гео, которое пользователь указал в запросе. А если ничего не указал, то срабатывает тег подмены по физическому местоположению клика.

Ну а дальше вы знаете: включаем режим отладки, проверяем работу тегов, публикуем контейнер.

А в Яндекс Директ так можно?

Поздравляю, уважаемые зрители! Только что вы настроили подмену города на сайте для трафика из Google Adwords. А как насчет Яндекс Директ? О, здесь тоже есть такие приколы. Речь идет про динамические параметры {region_name} и {region_id}.

К сожалению, в официальных источниках Яндекса я не нашел список айди регионов. Но зато наткнулся на огромный список, который спарсил Константин Добров. Я не знаком с этим специалистом, но большое спасибо. Как вы понимаете, алгоритм подмены аналогичный.

Скачать айди регионов

Сложно? Смотрите пошаговое видео!

Понравилось видео? Поделитесь с друзьями и коллегами. В следующем ролике мы рассмотрим подмену изображений на сайте. Хотя и так все понятно, верно?

Ссылочная масса

comments powered by HyperComments
(4 оценок, среднее: 4,75 из 5)
Загрузка ...
Блог Евгения Тридчикова