Google Tag Manager вместо Yagla: быстро, просто, бесплатно. Пошаговая инструкция

Создание мультилендингов — с адаптированным текстом под разные рекламные кампании — мечта маркетолога. Вы можете заметно повысить конверсию, подменяя слоган или заголовок на лендинге в соответствии с текстом рекламного объявления. Инструменты для такой настройки есть — например, Yagla. Мы расскажем, как заменить платный сервис Yagla общедоступными бесплатными инструментами Google Tag Manager.

Привет, я Александр Зарайский - руководитель обучающего центра контекстного рекламного агентства MOAB. Сегодня я покажу по шагам, как настроить текстовые подмены, подмену картинок, а также использовать другие возможности GTM.

Давайте договоримся сразу: сам по себе Yagla — хороший сервис, но платный. Возможность сэкономить — это всегда приятно, особенно для агентства с большим числом проектов. С помощью Google Tag Manager можно бесплатно сделать то, что Yagla предлагает за деньги — и даже больше.

Вообще, все началось с того, что мы запустили MOAB как контекстное рекламное агентство и придумывали тарифы на контекстную рекламу -например, такие, чтобы человек разом получал и Директ, и Ads, и работу с конверсией, и много других полезных вещей.

В рамках таких тарифов было бы круто делать текстовые подмены для лендингов с привязкой к запросу — объективно, это увеличивает конверсию в большинстве случаев. Однако, в случае с Yagla это привело бы к росту цен на наши услуги за счет стоимости самого сервиса. Идеальным выходом стал Google Tag Manager.

Google Tag Manager — это диспетчер тегов. С помощью этого инструмента можно создавать и обновлять теги для сайта или мобильного приложения. Он позволяет самостоятельно управлять тегами и настраивать нужные опции, не отвлекая программиста просьбами типа «А придумай какой-нибудь код, чтобы я мог посмотреть, сколько людей кликнуло на ту красную кнопочку».

Интерфейс GTM простой и интуитивно понятный, ведь его разрабатывали для маркетологов, а не для айтишников. Есть руководство по установке и настройке. И тонна полезных опций, включая добавление тегов ретаргетинга, отслеживание глубины прокрутки страницы и добавление кнопок соцсетей на картинки. Чуть позже мы рассмотрим несколько.

А еще GTM без проблем работает с тегами разных служб, обеспечивает простое тестирование и отладку, позволяет настраивать теги даже в загруженных пользователями приложениях и дает возможность проводить любое количество тестов, возвращаясь к самым эффективным версиям.

Ну и поскольку мы сравниваем его с Yagla —

Остается вопрос: если GTM такой крутой, почему на Yagla вообще есть спрос? Справедливости ради нужно сказать, что у Google Tag Manager есть парочка недостатков:

На этом минусы заканчиваются и начинаются плюсы.

С помощью Google Tag Manager можно менять любые элементы на сайте.

Для начала нам потребуется две переменных. Заходим в GTM, затем «Переменные» — «Создать». Первая переменная, которая нам нужна — URL, тип компонента — «Запрос». Ключ запроса и название переменной могут быть любыми. Главное, чтобы они были понятны вам. Например, вы можете указать ключ podmena и название «Запрос для подмены».

Теперь создаем вторую переменную типа «Таблица поиска» — она будет содержать данные для подмены. В пункте «Входная переменная» выберите название переменной, откуда нужно брать запросы для подмены — в нашем случае это «Запрос для подмены» (очевидно, правда?).

Затем добавляем несколько строк. Их может быть сколько угодно — зависит от количества вариантов, которые вы планируете использовать. В шаблоне указано, что должна содержать переменная, а в результате — текст, который будет отображаться на сайте. Например, в шаблоне мы можем указать значения 30 и None, а в результате — «Скидка 30%» и «Подарок при покупке» соответственно. Затем указываем имя переменной (например, podmena) и сохраняем.

Две переменных готовы. Теперь нам нужно создать тег типа «Пользовательский HTML». В нем пишем код (курсивом выделены части кода, которые нужно заменить):

<script>document.getElementById(“IDэлемента”).innerHTML=”{{podmena}}”</script>

Расшифрую: на сайте мы ищем элемент по указанному ID (его можно узнать с помощью опции «посмотреть код» в браузере) и в подставляем в него значение, которое хранится в переменной podmena.

Для этого тега нужно задать триггер активации типа «Просмотр страницы» и выбрать в настройках «Некоторые просмотры страниц», а затем «Page URL — Содержит — podmena».

Вот и все, теперь можно спокойно лить трафик на сайт, отправляя пользователей на страницы с нужным текстом. Так руками за 10 минут бесплатно можно сделать то, что в Yagla предлагают за деньги.

Теперь, если URL будет содержать переменную podmena с нужным запросом, текст в указанном объекте на странице будет меняться. Вот так:

Важный момент: если вы используете параметр подмены в рекламных объявлениях вместе с UTM-метками, помните о структуре составления параметров в URL. Сначала пишем «?», притом он всегда один. Каждый параметр и значение разделяем «&». Вот пример ссылки с UTM-меткой и параметром подмены:
domen.ru/?utm_source=google&utm_term=cpc&podmena=30

А что, если вам нужно менять не только текст, но и картинки?

Все то же самое. Только потребуется еще одна переменная типа «Таблица поиска», где в результатах вы будете указывать не текст, а путь к картинке. Например, images/mebel/stol1. Допустим, мы назовем эту переменную PodmenaImages.

И в теге типа «Пользовательский HTML» у вас будет написан такой код (то, что выделено курсивом, снова заменяем на нужные данные):

<script type="text/javascript">

document.getElementById(“ID элемента”).innerHTML=”{{podmena}}”

document.getElementById(“ID основной картинки”).src=”{{PodmenaImages}}”

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

А что там насчет статистики? Той самой, которая лучше, чем у Yagla, но настраивается отдельно? Элементарно: в любом счетчике нужно создать фильтр на переходы по URL, содержащим podmena. А если нужна более точная статистика, то по URL, содержащим podmena=[значение].

Для клиентов агентства MOAB мы используем весь функционал GTM для упрощения и ускорения внутренних работ и сбора статистики, причем по-прежнему — бесплатно. Давайте по шагам разберем, что еще хорошего можно сделать, используя GTM.

Это как UTM-метки, только для внутренних переходов на сайте.

В списке встроенных переменных выбираем Click URL. Затем создаем новый триггер типа «Клик» — «Только ссылки» и укажите для активации URL нужной страницы.

Теперь остается только добавить тег типа Universal Analytics (тип отслеживания — «Событие»), добавить в него нужный триггер, который мы только что создали, заполнить поля и сохранить. После этого вы сможете отслеживать клики в Google Analytics, раздел «События».

Здесь есть два варианта: отслеживание переходов по всем внешним ссылкам сразу или только по одной конкретной. Рассмотрим оба.

В обоих случаях нужно создать пользовательскую переменную типа URL и триггер «Клик». Ну и после окончания настроек создать тег отслеживания типа Universal Analytics и заполнить поля. А вот сами настройки будут разные.

Если нужно отследить переходы по всем внешним ссылкам на сайте, в пользовательской переменной выберите тип компонента «Имя хоста», а в источнике укажите {{Click URL}}.

Затем в триггере выберите «Некоторые ссылки» и укажите: имя хоста не содержит «доменное имя вашего сайта».

Если нужно отследить переход только по одной конкретной внешней ссылке, в настройках переменной укажите тип компонента «Полный URL», в поле «Источник» {{Click URL}}.

А в триггере выберите «Некоторые ссылки» и задайте настройки: «Конкретная ссылка — Содержит — “ссылка, которую вы хотите отследить”».

Ретаргетинг (вдруг не все в курсе) — это когда рекламу показывают только тем пользователям, которые хоть как-то взаимодействовали с сайтом. Например, просматривали товары, добавляли их в корзину или даже просто заходили, скроллили и выходили. Продать что-то человеку, который уже был на сайте и видел предложение продавца, проще, чем совсем «холодному» клиенту. Результат — реклама и дешевле, и эффективнее.

Теги ретаргетинга добавляются через GTM буквально за минуту. Создаем новый тег типа «Пользовательский HTML». Настраиваем ретаргетинг в кабинете сервиса (ВКонтакте, Facebook и пр.), получаем код, добавляем его через GTM, устанавливаем триггер активации, чтобы код срабатывал на нужных страницах, сохраняем — profit!

Кстати, именно так через Google Tag Manager можно добавлять и любые другие теги.

Эта опция особенно актуальна для лендингов. Если хотите знать, насколько далеко скроллят страницу пользователи и не пора ли убрать пару-тройку блоков, она вам пригодится.

Выберите тип триггера «Глубина прокрутки». Далее идут настройки:

С настройками закончили. Осталось организовать передачу данных в Google Analytics. Выбираем тип отслеживания «Событие», категорию Scrolling, действие {{Scroll Depth Threshold}}%, если вы выбрали проценты, или {{Scroll Depth Threshold}}px, если предпочли пиксели. Добавлять проценты или пиксели необязательно — просто вам же будет легче потом читать отчеты. Ярлык — {{Page URL}}, но если вы хотите отслеживать и горизонтальную, и вертикальную прокрутку, добавьте к ярлыку {{Scroll Direction}}.

Обратите внимание на значение «Не взаимодействие». Если вы хотите, чтобы доскролл влиял на показатель отказов, в это значение нужно вставить переменную типа «Таблица поиска». При ее заполнении учитывайте: если в результате true, событие НЕ влияет на показатель отказов, а если false — влияет. Например, если вы укажете 15 true, 50 false, доскролл до середины будет влиять на показатель отказов, а до 15% — не будет.

Чтобы отслеживать события скроллинга в Google Analytics, нужно составить такой шаблон отчета:

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

Активируем встроенную переменную Click Text. Создаем триггер «Клик — Все элементы» и выбираем вариант «Некоторые клики» в настройках. Затем указываем Click Text — Содержит — «Добавить в корзину» (или другой текст на кнопке, который вас интересует). Затем создаем тег типа Universal Analytics для отслеживания события и готово.

Google Analytics весьма своеобразно считает отказы. Он записывает в отказ любое посещение, при котором пользователь просмотрел только одну страницу и не совершил никаких действий (не заполнил форму, не нажал на кнопку обратного звонка и пр.) На одностраничниках этот показатель может доходить до 100%. Например, если пользователь зашел на сайт, прочитал текст, позвонил по указанному номеру телефона и закрыл страницу — он все равно будет записан как «отказник». Чтобы уточнить этот показатель и получить более точные сведения, можно через GTM настроить отслеживание длительности посещения без привязки к действиям. Пробыл на странице 20 секунд — уже не «отказ».

Как это сделать? Выберите тип тега Universal Analytics, тип отслеживания «Событие», затем задайте для тега триггер типа «Таймер» и задайте нужный интервал в миллисекундах.

Тут все очень просто: выбираете любой сервис по своему вкусу, копируете код кнопок и добавляете с помощью тега типа «Пользовательский HTML». Примерно так:

<script type="text/javascript" src=”код кнопок соцсетей”></script>

И не забываете указать триггер активации, особенно если кнопки должны появляться только на некоторых страницах.

И тут все тоже предельно просто. Генерируете код с помощью инструмента Schema или аналога, создаете тег типа «Пользовательский HTML», вписываете туда полученный код, а затем настраиваете активацию триггера. И все, на вашем сайте есть микроразметка!

Разумеется, данная статья - вовсе не призыв отказаться от одних инструментов (платных) и использовать другие (бесплатные). Если у вас все уже настроено и работает эффективно - к чему что-либо менять?

Но для тех, кто еще не использует текстовые подмены, попробовать их было бы гораздо проще с помощью данного руководства; в особенности - агентствам контекстной рекламы и фрилансерам, которым, как и нам в MOAB, приходится работать с большим количеством клиентов.

Уверен, что эту статью прочитают в Yagla - поэтому призываю коллег в комментарии - какие еще плюсы Yagla мы не учли?

#инструкции #маркетинг