Как отследить все входящие и пропущенные звонки из рекламных источников, имея всего лишь один дополнительный номер телефона? Инструкция по созданию бесплатного CallTracking своими руками! Автор: Андрей Педченко
Вы запускаете рекламные кампании и уже в первый месяц задумаетесь о рентабельности. Желание отслеживать эффективность каналов, по которым клиенты приходят на сайт, ― естественное, если даже не витальное. Решение давно придумано, и оно исправно работает ― да, речь пойдёт о колл-трекинге.
Если у вас есть лишний телефонный номер (мобильный или городской, ― не так важно) и желание сэкономить, мы поможем настроить колл-трекинг своими руками. Сделать это можно крайне быстро!
Логика работы колл-трекинга
- Устанавливаем на сайт Google Tag Manager (ГТМ) и Google Analytics (ГА).
- Размечаем контекстную рекламу utm-метками.
- Создаём в ГТМ правило для определения utm-меток.
- Создаём скрипт подмены телефонного номера при наличии в адресе utm-метки.
- Пишем скрипт, который создаёт в cookie (куки) нашу запись.
- Создаём скрипт для чтения куки и замены номера телефона в дальнейшем.
- Человек, принимающий звонок с подменного номера, отправляет данные о звонке в ГА.
Google Tag Manager
Для начала устанавливаем контейнер ГТМ на сайт.
Внедряем код Google Tag Manager после открывающего тега <body> на все страницы сайта.
В этом нет ничего сложного, но если вы ранее подобным не занимались, ― рекомендую сначала прочитать справку.
Google Analytics
Пункт необязателен, если контейнер ГА уже установлен на сайте, но лучше сделать так, как написано ниже.
Создаём тег ГА в ГТМ:
На панели слева выбираем меню «Теги» и нажимаем кнопку «Создать».
Применяем настройки как на изображении внизу, указав идентификатор отслеживания.
Разметка ссылок
В рассматриваемом примере отслеживается один канал. Для удобства, ко всем конечным URL рекламных объявлений добавим всего одну метку:
мойсайт.рф?utm_medium=cpc,
где medium ― тип канала, а срс ― маркер для контекста.
Правило определения меток в URL
В ГТМ открываем меню триггеров и создаём новый, назвав его «Страница содержит метку срс»:
В качестве события и типа триггера выбираем «Просмотр страницы»:
И ставим условие: Page URL содержит utm_medium=cpc.
Подмена номера
В рассматриваемом примере номер выглядит так:
и вот так:
Для подмены создадим новый тег в ГТМ:
Назовём его «Смена номера».
В выборе продукта выбираете «Пользовательский HTML», в поле ввода кода записываете скрипт:
1$('.phone').text('+7 777 777-77-77');
В условиях активации нажмите на кнопку «Ещё» и проверьте ранее созданный триггер:
Сохраняем. Теперь, если человек придёт из рекламы, он увидит изменённый номер:
Но если пользователь перейдёт на другую страницу, то там он увидит оригинальный номер, так как URL не будет содержать utm-метку. Поэтому в этот же тег «Смена номера» добавляем второй скрипт, записывающий в куки немного информации.
Запись в cookie
Просто добавим в поле ввода кода созданного выше тега новый скрипт:
1function set_cookie(name, value, exp_y, exp_m, exp_d) {2 var cookie_string = name + "=" + escape(value);3 if (exp_y) {4 var expires = new Date(exp_y, exp_m, exp_d);5 cookie_string += "; expires=" + expires.toGMTString();6 }7 document.cookie = cookie_string;8}910// Вводим имя для куки11var name = "change_phone";12// Вводим значение13var value = "cpc";14var current_date = new Date;15var cookie_year = current_date.getFullYear() + 1;16var cookie_month = current_date.getMonth();17var cookie_day = current_date.getDate();18set_cookie(name, value, cookie_year, cookie_month, cookie_day);
Код работает! Он описывает функцию установки куки set_cookie, затем вызывает её и подставляет в куки значения, указанные нами в строках.
1var name="change_phone";2var value="cpc";
Теперь браузер будет запоминать всех посетителей, пришедших из рекламы. Срок хранения куки 1 год. Если убрать из кода строки, описывающие запись даты в куки, то куки будет храниться в течение сеанса. В консоли вы увидите установленную запись.
Чтение cookie
Добавляем новый тег по аналогии с тегом «Смена номера», создание которого было описано выше. Но в условии активации выбираем «Все страницы». В примере он назван «Смена номера на всех».
Добавляем в тег скрипт, который получает значение куки, и, если оно нас устраивает, — подменяет номер на всех страницах сайта:
1function get_cookie(cookie_name) {2 var results = document.cookie.match('(^|;) ?' + cookie_name + '=([^;]*)(;|$)');3 if (results)4 return (unescape(results[2]));5 else6 return null;7}89// Указываем имя куки10var x = get_cookie("change_phone");11// Указываем значение куки12if (x == "cpc") {13 $('.phone').text('+7 777 777-77-77');14}
Здесь функция get_cookie будет искать нашу строку куки среди всех записей и сравнивать с тем, что мы записывали в куки ранее. Если всё сходится, номер подменяется. При повторном заходе на сайт пользователь вновь увидит подменённый номер.
Уже на этом этапе вы сможете отслеживать телефонные звонки, и делать выводы об эффективности контекстной рекламы. Поделите рекламный бюджет на количество принятых звонков, — теперь вы знаете во сколько рублей обходится один звонок. Если же вы хотите строить отчёты и делать выводы в различных срезах, то читаем дальше!
Передаём данные в Google Analytics
Мы рассмотрели простой случай, когда используется всего один подменный номер, и, скорее всего, IP-телефония здесь никак не привлечена. Звонки принимает человек и записывает в CRM или в блокнот. Этому человеку некогда вникать в импорт данных или протокол передачи данных. Поэтому создадим на сайте новую страницу (посетителям лучше не говорить о ней), и размещаем там одну кнопку «Звонок был». Попросим нашего человека нажимать на неё при поступлении звонка на подменный номер.
Вешаем на эту кнопку событие ГА, пример: ga(‘send’,’event’,’Звонок’,’был’); или создаём новый тег в ГТМ, который будет отправлять данные о событии в ГА при нажатии на кнопку. Для этого тега создаём новый триггер, — клик по кнопке «Звонок был». Подсматриваем код кнопки:
Создаём триггер с уловием активации Click ID содержит call_button.
Добавляем тег для отправки события о звонке.
Открываем в ГА отчёты в реальном времени по событиям, кликаем на кнопку «Звонок был» и видим успешную передачу события.
Далее, настраиваем цель и смотрим, сколько стоит привлечение одного такого звонка из контекста.
Заключение
Описанный выше способ работает и прост во внедрении. Замена номера происходит ни чуть не медленнее, чем у известных систем колл-трекинга. Все изменения в код легко вносить и оценивать благодаря встроенному отладчику ГТМ. Вам не нужно создавать .js-файлы и загружать их на хостинг, — работайте в одной среде. Вы всегда сможете масштабировать данный пример под прочие нужды, например, собирать данные о clientID и приветствовать на сайте тех пользователей, которые вам звонили. И это бесплатно. Этот алгоритм настройки отслеживания звонков подойдёт всем, кто не спешит глубоко вникать в аналитику или пока не решился на увеличение бюджетов для привлечения новых клиентов. Имея всего лишь дополнительный мобильный номер, вы сможете отследить все входящие и пропущенные звонки из контекста, узнать их длительность, выделить те, которые привели к продаже.
Данная статья показывает, что для организации динамического коллтрекинга с подменой номеров, на вашем сайте налету, не требуется никаких дополнительных платных сервисов, а достаточно просто подключить дополнительный номер на платформе Teleum.com — и немного поколдовать с бесплатными сервисами которые доступны каждому. Вы можете подключить 10 номеров для анализа и это вам обойдется в 500рублей в месяц.