Чтобы начать сбор данных о визитах пользователей на сайт, необходимо установить скрипт отслеживания на Ваш сайт. Он подключается как плагин, к скрипту отслеживания
Google Analytics
и позволяет получить и связать свыше 30 параметров визита посетителя, который совершил звонок на подменный номер или через виджет обратного звонка Callback.
Выбор варианта установки скрипта зависит от того как у вас установлен скрипт отслеживания Analytics.
Перед установкой скрипта отслеживания – необходимо зарегистрировать проект в системе Ringostat.
- установка в исходный код сайта со скриптом Global Site Tag (gtag.js);
- установка в исходный код сайта вместе со скриптом Google Universal Analytics;
- установка в Диспетчер тегов Google.
- установка без привязки к Google Analytics (используется также для GA4).
Как узнать, какая версия кода Analytics установлена?
Это инструмент, который позволяет быстро выполнять проверку или диагностику сайта, анализировать внедрение кода Analytics и устранять неполадки. Подробнее...
- Перейдите на ваш сайт;
- Откройте панель "инструменты разработчика" сочетанием клавиш Ctrl + U;
- Для показа строки поиска нажмите Ctrl + F;
- Далее, нужно выполнить поиск скрипта согласно описания ниже.
Вариант 1 – в строке поиска введите gtag
Если версия скрипта Global site tag (gtag.js), результатом поиска будет примерно следующий скрипт:
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXX-Y');
</script>
Для подключения скрипта отслеживания и подмены номеров, к коду GTAG - воспользуйтесь
инструкцией.
Если по запросу, скрипт с нужным счётчиком не будет найден, попробуйте найти код Google Universal Analytics.
Вариант 2 – в строке поиска введите analytics.js
Если версия скрипта Universal Analytics, результатом поиска будет примерно следующий скрипт:
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga...;
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
Для подключения скрипта отслеживания и подмены номеров, к коду Universal Analytics - воспользуйтесь
инструкцией.
Если по запросу, скрипт с нужным счётчиком не будет найден, попробуйте найти код Диспетчера Тегов Google.
Вариант 3 – в строке поиска введите gtm
Если на сайте установлен контейнер Диспетчера тегов Google, результатом поиска будет примерно следующий скрипт:
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});
var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;
j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})
(window,document,'script','dataLayer','GTM-XXXXXX');
</script>
Для подключения скрипта отслеживания и подмены номеров, к коду Universal Analytics - воспользуйтесь инструкцией.
В случае, если у вас не получилось разобраться с версией или вариантом установки кода отслеживания – будем рады помочь разобраться в чате или на email support@ringostat.com
Выберите тип установки скрипта:
- Global site Tag (gtag.js) Analytics
- Universal Analytics
- Google Tag Manager
- Без привязки к Google Analytics
(используется для GA4)
Установка скрипта в исходный код c GTAG
После регистрации проекта, необходимо адаптировать стандартный скрипт GTAG.js и заменить его на сайте.
Адаптация скрипта GTAG.js для подключения на сайт
Перейдите в личный кабинет Ringostat на страницу Общие настройки -> Настройки проекта:
Скопируйте значение поля Google Analytics resource ID и вставьте в поле ниже:
Перейдите на страницу Скрипт подмены --> Настройки скрипта:
Скопируйте скрипт отслеживания для Вашего проекта и вставьте в поле ниже:
Замена стандартного скрипта GTAG.js на адаптированный
Скопируйте адаптированный скрипт GTAG.js + Ringostat из поля выше и замените в исходном коде сайта стандартный GTAG.js.
Пример скрипта GTAG.js в исходном коде сайта до замены:
Пример скрипта GTAG.js в исходном коде сайта после замены:
На этом установка скрипта отслеживания Ringostat успешно выполнена
Установка скрипта в исходный код c Google Universal Analytics
После регистрации проекта, необходимо адаптировать стандартный скрипт analytics.js и заменить его на сайте.
Адаптация скрипта GTAG.js для подключения на сайт
Перейдите в личный кабинет Ringostat на страницу Общие настройки -> Настройки проекта:
Скопируйте значение поля Google Analytics resource ID и вставьте в поле ниже:
Перейдите на страницу Коллтрекинг -> Настройки скрипта:
Скопируйте скрипт отслеживания для Вашего проекта и вставьте в поле ниже:
Замена стандартного скрипта analytics.js на адаптированный
Скопируйте адаптированный скрипт analytics.js + Ringostat из поля выше и замените в исходном коде сайта стандартный analytics.js.
Пример скрипта analytics.js в исходном коде сайта до замены:
Пример скрипта analytics.js в исходном коде сайта после замены:
На этом установка скрипта отслеживания Ringostat успешно выполнена
Установка скрипта в Google Tag Manager
Создание переменной JavaScript
Для создания переменной нужно выбрать необходимый контейнер в вашем кабинете Google Tag Manager, перейти в раздел Переменные и нажать соответствующую кнопку:
Далее, необходимо указать понятное имя переменной(например, Ringostat CallTracking) и нажать на поле Конфигурация переменной:
В появившемся окне, нужно выбрать тип переменной Собственный код JavaScript:
Перейдите в личный кабинет Ringostat, на страницу Коллтрекинг -> Настройки скрипта:
Скопируйте скрипт отслеживания для Вашего проекта и вставьте в поле ниже:
После успешной генерации скрипта, скопируйте полученное значение и добавьте в соответствующую форму в настройках переменной и нажмите Сохранить:
Добавление переменной в тег Universal Analytics
После успешного создания переменной, её нужно добавить в тег с необходимым счётчиком Google Analytics.
Перейдите на страницу Теги и выберите тег содержащий счётчик Google Analytics, с триггером активации All Pages или Модель DOM готова:
В окне конфигурации тега, необходимо проверить наличие отметки :
Отметка "Включить переопределение настроек в этом теге" установлена?
- Да, установлена
- Не установлена
В случае, если установлена отметка переопределения настроек тега, нужно создать новое поле в настройках тега. Выберите Дополнительные настройки -> Поля, которые необходимо создать и нажмите кнопку + Поле:
Укажите название поля строго customTask и в значении через спец символы переменной {{ ... }} её название (в текущем примере {{Ringostat CallTracking}} ) и нажмите кнопку Сохранить:
Переменная
customTask может быть добавлена только 1 раз в 1м теге.
Если у вас уже есть переменная customTask – обратитесь в наш отдел поддержки для консультации.
Далее, нажмите Отправить:
В окне публикации контейнера добавьте понятное название версии контейнера, его описание и нажмите кнопку Опубликовать
На этом установка скрипта отслеживания Ringostat успешно выполнена
Если переопределение настроек тега не включено, нужно создать новое поле в настройках Google Analytics:
Выберите Дополнительные настройки -> Поля, которые необходимо создать и нажмите кнопку + Поле:
Укажите название поля строго customTask и в значении через спец символы переменной {{ ... }} её название (в текущем примере {{Ringostat CallTracking}} ) и нажмите кнопку Сохранить:
Переменная
customTask может быть добавлена только 1 раз в 1м теге.
Если у вас уже есть переменная customTask в настройках Google Analytics или конфигурации тега – обратитесь в наш отдел поддержки для консультации.
Далее, нажмите Отправить:
В окне публикации контейнера добавьте понятное название версии контейнера, его описание и нажмите кнопку Опубликовать
На этом установка скрипта отслеживания Ringostat успешно выполнена
Установка скрипта без привязки к Google Analytics (используется также для GA4)
- если используется только версия Google Analytics 4;
- если непростая настройка Google Analytics, которую сложно совместить со скриптом Рингостат;
- если не используется Google Analytics на сайте.
(function (d,s,u,e,p) {
p=d.getElementsByTagName(s)[0],e=d.createElement(s),e.async=1,e.src=u,p.parentNode.insertBefore(e, p);
})(document, 'script', 'https://script.ringostat.com/v4/ХХ/ХХХХХХХХХХХХХХХХХХХХХХХХХХХХХХХХХХ.js');
var pw = function() {if (typeof(ringostatAnalytics) === "undefined") {setTimeout(pw,100);} else {ringostatAnalytics.sendHit('pageview');}}
pw();
</script>
Чтобы сгенерировать необходимый для установки скрипт необходимо заменить выделенные данные
на уникальные данные проекта.
Для этого перейдите в раздел Коллтрекинг -> Настройки скрипта
и скопируйте только выделенный на скриншоте фрагмент скрипта:
Пример адаптированного скрипта:
Скрипт есть возможность установить в исходный код сайта или в диспетчер тегов.
- если в коде сайта не установлен скрипт Google Analytics, скрипт Ringostat необходимо устанавливать в раздел head или в начало открывающего тега body.
- если в коде сайта установлен скрипт Google Analytics, скрипт Ringostat необходимо устанавливать сразу после него:
Пример, как выглядит установка скрипта на сайте
Google Analytics resource ID который установлен на сайте и в настройках личного кабинета в этом случае должен совпадать
-
необходимо установить как отдельный тег выбирая шаблон “Пользовательский HTML” и тригер активации “All pages”.
После установки скрипта на сайт одним из способов в личном кабинете в разделе Коллтрекинг -> Настройки скрипта в пользовательских настройках необходимо добавить настройку "noGa": true,
Далее необходимо настроить отслеживаемые сущности и вебхуки для передачи данных по звонкам в аккаунт Гугл Аналитики.
Настройка передачи данных:
1. Настройка отслеживаемых сущностей
Переходим в раздел Коллтрекинг -> Отслеживаемые сущности
- :
- задаём название "sessionId"
- выбираем тип отслеживания "Expression".
- задаём уровень отслеживания на уровне "Сессии".
- задаём значение переменной, с помощью которого мы будем отслеживать сущность — document.cookie.match('(^|;)\\s*_ga_XXXXXXXXXX\\s*=\\s*([^;]+)').pop().split('.')[2], где "ga_XXXXXXXXXX" соответствует реальному счётчику, установленному на сайте — G-XXXXXXXXXX.
Т.е. указываем в формате ga_[Google source ID]. Вместо "Google source ID" подставляем уникальное значение счётчика, указанное после "G-". Счётчик смотрим на сайте.
Пример:
- задаём название "sessionNumber"
- выбираем тип отслеживания "Expression".
- задаём уровень отслеживания на уровне "Сессии".
- задаём значение переменной, с помощью которого мы будем отслеживать сущность — document.cookie.match('(^|;)\\s*_ga_XXXXXXXXXX\\s*=\\s*([^;]+)').pop().split('.')[3], где "ga_XXXXXXXXXX" соответствует реальному счётчику, установленному на сайте — G-A1B23C4567XXXXXXXXXX.
Т.е. указываем в формате ga_[Google source ID]. Вместо "Google source ID" подставляем уникальное значение счётчика, указанное после "G-". Счётчик смотрим на сайте.
Пример:
- задаём название "clientId
- выбираем тип отслеживания "Expression".
- задаём уровень отслеживания на уровне "Сессии".
- задаём значение переменной, с помощью которого мы будем отслеживать сущность — gaGlobal.vid.
Настройка сущностей будет выглядеть так:
2. Настройка вебхука
Переходим в раздел Интеграции -> Webhooks. Нажимаем редактировать:
В открывшемся окне меняем ссылку в поле URL*
на https://www.google-analytics.com/g/collect?v=2&tid=G-XXXXXXXXXX&en=call, где " G-XXXXXXXXXX" соответствует реальному счётчику, установленному на сайте.
Далее переходим в настройки вебхука
и в открывшемся окне вносим изменения:
- Для параметра cid указываем значение "Custom".
Строкой ниже указываем название соответствующего параметра — "clientId" (имя отслеживаемой сущности для трекинга Google client ID). - Добавляем параметр sid и указываем его значение "Custom".
Строкой ниже указываем название соответствующего параметра — "sessionId" (имя отслеживаемой сущности для трекинга ID сессии). - Добавляем параметр sct и указываем его значение "Custom".
Строкой ниже указываем название соответствующего параметра — "sessionNumber" . - Добавляем параметр ep.disposition и указываем его значение "Статус".
- Добавляем параметр ep.uniqueCall и указываем его значение "Первый уникальный звонок".
- Правим название параметра uipl на_uip".
- Добавляем параметр dl - последняя просмотренная страница
- Удаляем параметр tid, в котором ранее передавали Google Analytcis resource ID, т.к. его уже прописали в ссылке вебхука ранее.
- Удаляем параметр ec, в котором ранее передавали Статус, т.к. его уже прописали в ссылке вебхука ранее.
- Удаляем параметр ea, в котором ранее передавали Уникальный первый звонок, т.к. его уже прописали в ссылке вебхука ранее.
- Удаляем параметр el.
Измененный вебхук будет выглядеть так
На этом настройка успешно выполнена
В случае, если вы совместно используете Universal Google Analytics (или GTAG) с GA4, то скрипт подмены необходимо установить тем же способом, что описан при использовании Universal Analytics или GTAG. Т.е. скрипт подмены устанавливается стандартным способом.
Также, при совместном использовании Universal Google Analytics (или GTAG) с GA4 потребуется дополнительная настройка интеграции для Google Analytics 4.