Мультилендинг на тильде как сделать
Настройка аналитики на мультилендинге Tilda: проблемы и решения
Эпическая история Дмитрия Карпушина о том, как настраивали веб-аналитику для страницы на Tilda. Кейс агентства Orwo.
В работе веб-аналитика много интересных задач, не обо всех удаётся рассказать, но сегодня я поделюсь историей настройки аналитики на мультилендинге Tilda. А ещё о том, на какие грабли наступил в процессе и как их обошёл.
Статья будет полезна:
Исходные данные и важные мелочи
Изначально задача звучала как «настроить аналитику на сайте для мультилендинга». Известный факт, что, чем точнее сформулирована задача, тем эффективнее её можно решить. Поэтому я уточнил недостающую информацию и поставил задачу конкретней.
Всё, что нужно знать о рекламе в мобильных играх
Аналитический обзор Gameloft: рекламные форматы, портрет аудитории, надёжные бенчмарки.
Для каждого мероприятия создаются три лендинга: страница с описанием и две страницы с регистрацией.
Задачи
Поясню последний момент. Сложность в том, что в дальнейшем будут создаваться новые посадочные страницы. Планируются десятки новых мероприятий. Стандартное решение с добавлением событий на конверсионные кнопки не годится.
При настройке событий на конверсионных кнопках придётся добавлять новые идентификаторы: и в код сайта, и в системы аналитики для каждого нового мероприятия. Мало того — в Google Analytics (далее GA) упираемся в 20 целей на одно представление, а в Яндекс.Метрике (далее ЯМ) это ограничение в 200 целей на счётчик, что тоже может быстро закончиться.
Такая система не будет автоматизированной, и в процессе работы, например, при добавлении новых идентификаторов не исключено, что исполнитель допустит ошибку. К тому же идентифицировать название мероприятия не представляется возможным (в ЯМ совсем, в GA только для целей по отчёту «URL целей»).
В GA присутствует отчёт «Конверсии — Цели — URL целей», который показывает местоположение достигнутой цели. Возможно, его можно было бы использовать для анализа страниц, на которых пользователи достигли целей?
Привожу пример отчёта для наглядности:
Пример того, как мы бы видели информацию о регистрации на мероприятия.
Внимательно посмотрев на отчёт, становится понятно, что он не способен решить наши задачи. У нас нет возможности детально рассмотреть параметры сессий и желаемые метрики.
Честно говоря, идея с использованием целей так себе. Нужно что-то другое.
Что-то другое
В GA присутствуют встроенные инструменты для расширения знаний о действиях пользователя «вокруг» событий, которые отлично подойдут для нашей задачи.
Например, если мы получаем событие (такое как клик на кнопку «подробнее»), то можем передавать в интерфейс GA параметры этого события:
Эти инструменты называются пользовательские параметры (Custom Dimensions) и пользовательские показатели (Custom Metrics) (далее ПП и ПП). Именно их мы будем использовать!
Плюс применения инструментов в том, что после настройки мы можем:
Примечание. Рекомендую ознакомиться с пользовательскими параметрами и показателями в GA. На деле данный инструментарий очень полезен и часто незаменим.
Для метрики используем аналогичную функциональность, называется «Параметры визитов».
Отдельного внимания заслуживает Tilda — платформа, на которой «крутится» сайт.
«Преимущества» платформы Tilda
1. Для решения задачи нам понадобится модернизировать код счётчиков GA и ЯМ. Сделать это в Tilda стандартными средствами нельзя, так как подключение кода счётчика идёт по идентификатору отслеживания счётчика.
Однако выход есть, нужно создать кастомный блок html и скопировать туда наши, изменённые коды GA и ЯМ. Добавьте этот блок в шаблон страницы сайта, чтобы код присутствовал на всех страницах.
Примечание. Не забудьте убрать стандартную связь Tilda с GA и ЯМ, иначе могут возникнуть проблемы с получаемыми данными.
2. Ещё одной «прекрасной» новостью Tilda стал перечень разрешений на управление счётчиком GA. Не знаю, как вам, а мне он показался достаточно избыточным.
Рука не поднялась дать перечисленные разрешения для аккаунта GA, на котором есть счётчики других сайтов. Все коды счётчиков добавили в кастомный блок html.
Приступим к построению нашей системы аналитики.
Настройки в Google Analytics
Настраиваем ПП и ПП в GA.
Алгоритм работы с Custom Dimensions и Custom Metrics выглядит так.
Пользовательские параметры и показатели задаются в интерфейсе GA на уровне ресурса:
Мы в эти параметры будем помещать информацию о названии ивента, а также о варианте участия. «Регистрацию» и «Оплату» будем фиксировать как обычные события.
Google Analytics созданному параметру присвоит индекс. По индексу программисты позже передадут значения.
Индекс параметра — цифра после названия переменной dimension
Если вы его не запомнили, то всегда увидите в разделе «Пользовательские определения — Пользовательские параметры на уровне ресурса» (средний столбец в «администраторе»):
В коде обращение к Dimension будет только по dimension1, dimension2 и так далее. Например, вот так задаём:
Пообщавшись с техническим специалистом, решили:
Важно. Отсюда первое и единственное ограничение к созданию страниц с событиями:
При последующем создании страниц мероприятий важно не забывать добавлять в конце URL-адреса «_free» для страниц с бесплатной регистрацией и «_std», для страниц с платной регистрацией.
Для удобства
Дополнительно в GA настроили пользовательские показатели:
Когда пользователь начинает регистрацию — отправляем этот показатель для него со значением 1. Я это сделал для того, чтобы можно было посмотреть данные в любых отчётах.
Когда пользователь успешно завершает регистрацию, мы отправляем в GA значение 1 в показатель «Количество успешных регистраций».
Значения показателей GA умеет суммировать, высчитывать среднее и любые другие операции, которые свойственны стандартным показателям.
Значение показателя в коде задаётся аналогично пользовательским параметрам:
Отправляем значения ПП и ПП в GA через событие. То есть сначала задаём все нужные параметры, показатели, а после этого в коде создаём событие, которое отправит наши данные в систему.
Обратите внимание
Пример кода с отправкой ПП:
ga(‘set’, ‘dimension1’, myName); /* задаём пп 1 */
ga(‘set’, ‘dimension2’, status); /* задаём пп 2 */
ga(‘set’, ‘metric2’, ‘1’); /* задаём пп 2 */
ga(‘send’, ‘pageview’, ‘/dimension’); /* передаём пп и пп через событие pageview*/
На этом с настройкой Google Analytics закончили, перейдём к Метрике.
Настройка показателей визитов в Яндекс.Метрике
Для метрики записываем в «Параметры визитов»:
Как это сделать
Для использования параметров визита нужно:
модернизировать код счётчика, добавив одну строку:
Примечание: напомню, мы отключили стандартную интеграцию Tilda с Яндекс.Метрикой и перенесли модернизированный код ЯМ в html-блок.
определить момент, когда передавать параметр (например, при успешной отправке заявки);
задать значение с помощью следующего кода:
отправить значение в Метрику.
Примечание: параметры визита передаём в Метрику с помощью необязательного аргумента метода reachGoal. Подробнее о разных способах передачи параметров визита.
В интерфейс Метрики попадёт именно то название «имя_параметра», которое вы передали в коде. Данные вы сможете видеть в стандартном отчёте «Стандартные отчёты — Содержание — Параметры визитов» или можете создать кастомный отчёт с интересующими группировками.
Особенности параметров визитов
Попытка number one. Изначально мы хотели передавать структуру из трёх уровней вложенности (в справке написано, что можно передавать до 10 уровней вложенности включительно), однако у нас не получилось это реализовать.
Ну как, не получилось. сделали, но в структуре появлялись лишние звенья, которые усложняли процесс построения отчётности. Дело в том, что параметры визита в нашем случае динамические (задаём с помощью переменных), из-за этого в промежуточные звенья попадают названия переменных, и в отчёте это выглядит так:
myParam — это название переменной. Сложно воспринимается информация
Хотя в настройках группировки можно убрать уровни, в которых присутствуют названия переменных, мы решили отказаться от этого способа.
Попытка number two. Пробовали передавать название мероприятия и вариант участия в мероприятии разными параметрами. И это было очередными граблями для карликов, которые больно били по. эго.
Такая передача в отчётах отображалась следующим образом:
В этом варианте передачи параметров визитов нет возможности установить соответствие между названием мероприятия (1) и вариантом участия (2). Когда данных станет больше, установить взаимосвязь будет невозможно.
Попытка number three. Поэтому мы решили отказаться от вариантов выше и объединили параметры в один:
Передаём параметр визита так: «Название мероприятия — Вариант участия».
Этот вариант нас устроил. С настройками в Яндекс.Метрике закончили.
Дальше — больше: проблемы
После настроек проверяем корректность поступаемых данных и фиксим все сбои (если таковые будут).
Проблема 1: Классический баян
При проверке корректной передачи параметров визитов (в Метрику), выявили проблему: на некоторых страницах стоял устаревший счётчик Яндекс.Метрики. Банальная, но сложно диагностируемая проблема.
Косвенно об этом свидетельствуют множественные внутренние переходы с основного домена сайта. А явно это увидели, когда заглянули во все шаблоны страниц и сравнили коды счётчика.
Решение: поставили на всех страницах сайта одинаковый код ЯМ и переопубликовали каждую страницу (Tilda же).
Проблема 2: Дело было не в бобине
На следующий день снова всплыли проблемы с получением данных. Успешные регистрации в ивентах не приходили в системы аналитики.
Как и ожидали: дело было не в бобине.
Выяснили, что личный кабинет — это отдельный сайт на поддомене (чего мы не замечали раньше). По умолчанию счётчик GA фиксирует посещения с поддоменов, но код GA на страницах поддомена вообще отсутствовал.
Поэтому мы добавили код GA на страницы личного кабинета. Дополнительно в GA быстренько запилили расширенный фильтр для междоменного отслеживания.
Междоменное отслеживание можно и не настраивать, но я настроил с целью получения информации о полном URL страницы, с которой была осуществлена оплата.
Проблема 3: Память такая память
После настройки междоменного отслеживания в представлении GA не забываем подкорректировать цели, которые настроены на URL страниц. Так как после настройки междоменного отслеживания GA видит страницы вместе с доменом сайта.
Например, цель, настроенная на страницу /robox/success/, которая работала раньше, после настройки междоменного отслеживания не будет работать. Теперь GA видит эту же страницу как site.ru/robox/success/. Поэтому замените URL страницы в цели на site.ru/robox/success/. Помните об этом! Либо используйте условие «содержит», но это не всегда уместно.
Что ещё было настроено
Ecommerce
Для получения данных по доходу настроили электронную торговлю в GA. Использовали только часть возможностей электронной торговли (id, name, price). Написали ТЗ техническому отделу, внедрили код на сайт. Теперь в GA поступают данные о заказах.
Настройка в MailChimp
Настроили интеграцию почтовых рассылок (MailChimp) с Google Analytics. Важно не забывать размечать каждую ссылку в письме utm-метками.
Исключаемые источники перехода
Добавили домен платёжной системы в список исключаемых источников перехода, чтобы трафик с неё не определялся как рефферер и не создавался новый сеанс.
Кастомные отчёты в GA
Настроили отчёты с нужными параметрами и показателями, чтобы в один клик смотреть нужные данные.
Какие данные удалось «вытащить» на основе настроенной системы аналитики
Настройка закончена (пока что). Сразу же после настройки запустили рекламные кампании, по окончании которых я оценил их эффективность на основе новенькой системы аналитики.
Посмотрим, какие данные получили.
1. Клиент может поручать создание новых мероприятий любому специалисту и знать, что аналитика по сайту будет собираться в автоматическом режиме.
Единственное ограничение — при создании страниц новых мероприятий не забыть добавить в конце URL-адреса «_free» для страниц с бесплатной регистрацией и «_std», для страниц с платной регистрацией.
2. В отчётах видно, с каких каналов совершены покупки, на какую сумму, какая конверсия канала в покупку.
3. Видно, какие мероприятия самые популярные и как распределились регистрации по варианту участия.
4. В отчёте GA отражено, как распределились регистрации с привязкой к источнику, с которого было посещение, плюс видно, как проходил процесс регистрации.
Жёлтым цветом отметил значение, которое требуется в перепроверке. Возможно, один пользователь отправил заявку на регистрацию раньше, а в отчётный период подтвердил регистрацию с почты
5. Легко считаем конверсию в начатую регистрацию/успешную регистрацию в разрезе источников.
В таблице выше наблюдаем, как нещадно сливается трафик, а вместе с ним и деньги с рекламы в Google. Как я выяснил во время анализа трафика, причина была в «кривой» адаптивной вёрстке сайта
Конечно же, мы можем посчитать стоимость лида в платные мероприятия и в бесплатные в разрезе мероприятий и рекламных кампаний.
Update 1. Далее на сайте были настроены ClientID и UserID. Так мы оценим продажи с точки зрения пользователей. Понимаем, какие пользователи на какие мероприятия зарегистрировались.
Прикладное использование этих данных огромно. Например, можно показывать рекламу пользователям, которые зарегистрировались в бесплатные мероприятия, участвовали в них, и дожимать до покупки приятного бонуса на память о прошедшем событии.
Или можно определять участников по приоритетным для них категориям событий и показывать только максимально релевантную рекламу.
Настройка UserID позволила увидеть использование сайта с нескольких устройств. Появилось наглядное представление того, как пользователи на самом деле посещают сайт.
К вопросу о том, стоит ли настраивать UserID. Конечно, стоит!
Update 2: В отправку транзакции был добавлен ещё один параметр — category. Этот параметр мы использовали в своих целях и теперь записываем туда дополнительные данные об оплате.
Так как цикл продаж может составлять пару месяцев, то, чтобы не терять связь покупки и мероприятия, к которому она относится, мы и добавили параметр category. Он позволяет узнать дополнительную информацию о привязке произошедшей оплаты к мероприятию. Эти данные мы в дальнейшем используем в рекламе.
Выводы
Задачи бизнеса решены. Настроили даже больше, чем изначально планировали. Приятная особенность такой системы в том, что работает в автоматическом режиме и не требует постоянных правок.
P. S. В будущем планирую:
На этом всё, спасибо за уделённое время. Надеюсь, было полезно. Буду рад уточнениям, предложениям, вопросам. Интересных задач, высоких конверсий, счастливых клиентов!
Мультилендинг и динамическая подмена контента на сайте
Немного выше я писал про мультилендинг, как про одну из мощных «фишек» для увеличения конверсии сайта. И это действительно так!
При правильном использовании эта штука реально «взорвет» Вам конверсию! Но только при правильном использовании!
Предлагаю немного подробнее коснуться этого вопроса.
Для начала запомните несколько терминов. Они, по сути, говорят об одном и том же механизме, хотя и немного отличаются по «философии».
Мультилендинг. Динамическая подмена контента. Гиперсегментация
Немного терминологии. Мультилендинг на самом деле не является синонимом динамической подмены контента. Мультилендинг можно сделать с помощью множества отдельных «статичных» страниц. А динамическая подмена контента происходит на одной странице.
Термин «гиперсегментация» был введен руководителем сервиса Yagla и описывает комплекс работ по группировки и связке ключевых фраз, рекламных объявлений и контента на сайте.
Как работает динамическая подмена контента
Например, фирма продает велосипеды горные и городские. Причем, может еще продавать в рассрочку. А может и без рассрочки.
Обычно сильно не заморачиваются и пишут на сайте и в объявлениях что:
«Продаем горные и городские велосипеды. За наличный расчет и в рассрочку!»
Но… это все-таки разные клиенты. И желательно для каждого клиента свою страницу. Тогда релевантность (соответствие) рекламы и сайта будет выше. Соответственно и вероятность того, что клиент закажет будет выше.
То есть, клиент видит в рекламе «горные велосипеды» и переходит на страницу, где такой же текст и соответствующий рисунок. Включая надпись на кнопке.
А если видит рекламное объявление «велосипеды для города», то на странице ему покажется такой же заголовок, аналогичный рисунок и тому подобное.
В результате конверсия сайта многократно возрастает, так как посетитель видит везде то, что ищет.
На рисунке ниже я приведу «хрестоматийный» пример, который демонстрирует сервис Ягла посетителям сайта.
Демонстрация работы сервиса Ягла. «Обычная» реклама
Демонстрация работы сервиса Ягла. Гиперсегментация в действии
Кстати, еще одной разновидностью подмены контента является автоматическое определение города посетителя и корректировка объявлений.
Например «Продажа домов из бруса в Воронеже», для посетителя из Воронежа. При этом конверсия будет намного выше.
То есть, имея товар с несколькими вариантами исполнения, разумнее не разносить их по разным карточкам, а сделать с помощью мультилендинга.
Вроде бы идеальный идея! Но… есть и минусы.
Минус 1 Мультилендинга
Во-первых, это все достаточно сложно реализуется. Ведь нужно правильно сгруппировать объявления и ключевые фразы. Правильно прописать UTM метки. Внедрить нужный код на сайт. И на сайте тоже прописать все варианты текста и рисунков. Будьте готовы, что стоимость работы специалиста по гиперсегментации намного выше, чем «обычного» директолога.
Минус 2 Мультилендинга
Во-вторых, посетитель сайта видит только одно предложение, один товар или услугу. А не несколько. В результате он может подумать, что Вы торгуете только одним товаром и уйдет.
Минус 3 Мультилендинга
В-третьих, далеко не всегда подмены работают хорошо. Особенно, если реализованы через сторонние сервисы. И посетитель сайта вместо тщательно продуманных заголовков и рисунков видит усредненный «нулевой» вариант.
И, наконец, эта подмена хорошо работает только для контекстной рекламы и таргетированной рекламы в соцсетях. Причем, для социальных сетей только в том случае, если есть таргетинг по ключевому слову. И то с большими оговорками. Для СЕО эта фишка не работает.
Более того. Для СЕО сайт с динамической подменой контента вреден! Почему? Потому что, в этом случае Вы упускаете отличную возможность достаточно легко попасть в топ-10 по большому семантическому ядру низкочастотных запросов, под которые оптимизируется контент страниц!
В случае мультилендинга страница-то одна, а не несколько десятков и сотен!
Как же подменять контент на сайте, если Вы оценили все плюсы и минусы и приняли такое решение? Есть несколько вариантов.
Специальные скрипты на сайте
Можно поместить специальные скрипты на сайт. Это должен делать программист. В паре с директологом. Самостоятельно в большинстве случаев Вы не справитесь, так как кроме скриптов, нужно правильно прописывать UTM метки. И все это сопрягать с контентом на сайте.
Кроме того, часто с помощью скрипта можно подменять только один элемент. Например, только оффер. А хотелось бы менять и подзаголовок. И буллиты. И рисунок. И надпись на кнопке.
Функция «мультилендинг» в конструкторах сайтов
В ряде конструкторов изначально заложена возможность создания мультилендинга. Например, в Тильде и Креатиуме. Никаких дополнительных скриптов устанавливать не нужно.
Однако, как я уже писал выше, эти решения платные. Не то, чтобы сумма запредельная, но, нужно платить ежемесячно.
Тем не менее, для самостоятельной реализации этот вариант наиболее удобен. Документации на этот счет достаточно много и с ней может разобраться даже не специалист!
Хотя я все-таки рекомендую и в этом случае привлекать к работе специалиста, знакомой с данной темой, так как есть много тонкостей, которые могут как сильно увеличить конверсию, так и наоборот, ее «уронить»!
Реализация через Google Tag Manager
Можно реализовать подмену контента через дополнительные сервисы типа Google Tag Manager, но в этом случае нужно вставлять код на сайт, правда это уже не так сложно, как поставить вышеприведенный скрипт.
Здесь опять сложность не в техническом воплощении (хотя новичку будет непросто), а в правильной кластеризации запросов. По-другому, в их грамотной группировке.
А для этого опять же нужен специалист с опытом подобной работы.
Сервис Yagla или аналоги
Отличным вариантом реализации функции динамической подмены контента является сервис Yagla.
Этот сервис работает практически со всеми конструкторами сайтов. Он достаточно удобный и надежный.
Одной из «фишек» Яглы является то, что Вы можете компоновать ключевые фразы прямо в этом сервисе, а не в аккаунте Яндекс Директа. Поверьте! Это очень удобно.
Кстати, с помощью такой гиперсегментации можно обойти статус «мало показов», если у Вас много низкочастотных фраз.
Сразу хочу сказать, что сервис Ягла платный. Но есть вариант использовать Яглу бесплатно, но только если разместить свою рекламы на их аккаунте. В этом случае тоже берется небольшой % от рекламного бюджета.
Из минусов хочу отметить, что на момент написания данной книге в Ягле нет функции геотаргетинга. Это конечно недоработка этого сервиса.
Кроме Яглы есть еще несколько аналогичных сервисов. Но на мой взгляд, они проигрывают по функциональности.
Плагины для Вордпресса
Для Вордпресса есть несколько плагинов для динамической подмены контента.
Наиболее «крутой» плагин мультилендинга – это IfSo. Этот плагин платный, но очень функциональный. Если у Вас есть на него деньги, то попробуйте.
При этом у него есть ряд функций, которых нет в Ягле (например, геотаргетинг).
К сожалению, бесплатный функционал данного плагина очень ограничен, и Вы не сможете реализовать на нем функционал мультилендинга.
Итого. Мультилендинг штука очень полезная и реально помогает увеличить конверсию сайта. Но к созданию сайта с динамической подменой контента стоит подходить очень аккуратно. Учитывая все плюсы и минусы
Еще один пример мультилендинга или динамической подмены контента
Специалист по интернет-рекламе
Бессонов Александр