Интеграция Revroute с Google Tag Manager  позволяет отслеживать события конверсий непосредственно из Google Tag Manager.

Предварительные требования

Установка Revroute через Google Tag Manager

Установка скрипта Revroute Analytics через Google Tag Manager состоит из 2 шагов:

1. Добавить скрипт Revroute Analytics в GTM
2. Создать пользовательскую переменную для cookie dub_id

Шаг 1: Добавить скрипт Revroute Analytics в GTM

Сначала необходимо добавить скрипт Revroute Analytics на ваш сайт с помощью Google Tag Manager.

В рабочей области GTM перейдите в раздел Tags и нажмите New, чтобы создать новый тег.

Выберите Custom HTML в качестве типа тега и добавьте следующий код:

<script>
  (function (c, n) {
    c[n] =
      c[n] ||
      function () {
        (c[n].q = c[n].q || []).push(arguments);
      };
 
    var methods = ["trackClick", "trackLead", "trackSale"];
    for (var i = 0; i < methods.length; i++) {
      (function (method) {
        c[n][method] = function () {
          var args = Array.prototype.slice.call(arguments);
          args.unshift(method);
          c[n].apply(null, args);
        };
      })(methods[i]);
    }
 
    var s = document.createElement("script");
    s.defer = 1;
    s.src = "https://www.dubcdn.com/analytics/script.conversion-tracking.js";
    s.setAttribute("data-publishable-key", "dub_pk_xxxxxxxx"); // Replace with your publishable key
    document.head.appendChild(s);
  })(window, "dubAnalytics");
</script>

Настройте срабатывание тега на All Pages, установив триггер All Pages - Page View.

Назовите этот тег “Revroute Analytics script” и сохраните его.

Шаг 2: Создание пользовательской переменной для cookie dub_id

Чтобы считывать cookie dub_id, которую устанавливает скрипт Revroute Analytics, необходимо создать пользовательскую переменную в Google Tag Manager.

В рабочей области GTM перейдите в раздел Variables и нажмите New, чтобы создать новую переменную.

Настройте переменную со следующими параметрами:

• Variable Type: выберите 1st Party Cookie
• Cookie Name: введите dub_id
• Variable Name: назовите “Revroute ID Cookie”

Нажмите Save, чтобы создать переменную.

Отслеживание событий лидов

Существует два способа отслеживания событий лидов с помощью Google Tag Manager:

• Отслеживание на странице благодарности (рекомендуется)
• Отслеживание отправки формы

Вариант 1: Отслеживание на странице благодарности (рекомендуется)

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

Создайте тег Custom HTML со следующим кодом:

<script>
  (function () {
    // Get query parameters from URL
    var params = new URLSearchParams(window.location.search);
    var email = params.get("email");
    var name = params.get("name");
 
    // Get dub_id from cookie using GTM variable
    var clickId = {{Revroute ID Cookie}} || "";
 
    // Only track the lead event if email and clickId are present
    if (email && clickId) {
      dubAnalytics.trackLead({
        eventName: "Sign Up",
        customerExternalId: email,
        customerName: name || email,
        customerEmail: email,
        clickId: clickId,
      });
    }
  })();
</script>

Настройте срабатывание тега на определённых страницах, создав триггер Page View с условиями:

• Тип триггера: Page View
• Триггер срабатывает при: Some Page Views
• Добавьте условия, например:
  • Page URL содержит /thank-you
  • Или Page Path равен /success
  • Или любой другой шаблон URL, соответствующий вашим страницам благодарности

Назовите этот тег “Revroute Lead Tracking - Thank You Page” и сохраните его.

Вариант 2: Отслеживание отправки формы

Этот метод отслеживает лидов сразу при отправке формы на вашем сайте. Обратите внимание, что этот подход может быть менее надёжным из-за блокировщиков рекламы и проблем с таймингом.

Создайте тег Custom HTML со следующим кодом:

<script>
  (function () {
    // Get form data - customize these selectors based on your form
    var name = document.getElementById("name")
      ? document.getElementById("name").value
      : "";
    var email = document.getElementById("email")
      ? document.getElementById("email").value
      : "";
 
    // Get dub_id from cookie using GTM variable
    var clickId = {{Revroute ID Cookie}} || "";
 
    // Only track the lead event if email and clickId are present
    if (email && clickId) {
      dubAnalytics.trackLead({
        eventName: "Sign Up",
        customerExternalId: email,
        customerName: name || email,
        customerEmail: email,
        clickId: clickId,
      });
    }
  })();
</script>

Настройте срабатывание тега по Form Submission, создав новый триггер:

• Тип триггера: Form Submission
• Триггер срабатывает при: Some Forms (или All Forms, если хотите отслеживать все отправки форм)
• Добавьте условия для указания, какие формы должны активировать отслеживание лидов

Назовите этот тег “Revroute Lead Tracking - Form Submission” и сохраните его.

Отслеживание событий продаж

Существует два способа отслеживания событий продаж с помощью Google Tag Manager:

• Отслеживание на странице подтверждения заказа (рекомендуется)
• Отслеживание отправки формы оформления заказа

Вариант 1: Отслеживание на странице подтверждения заказа (рекомендуется)

Этот метод отслеживает продажи, когда пользователи попадают на страницу подтверждения заказа или успешного завершения после покупки. Этот подход более надёжен, так как менее подвержен блокировке рекламными блокировщиками и обеспечивает лучшую точность данных.

Создайте тег Custom HTML со следующим кодом:

<script>
  (function () {
    // Get query parameters from URL
    var params = new URLSearchParams(window.location.search);
    var customerId = params.get("customer_id");
    var amount = params.get("amount");
    var invoiceId = params.get("invoice_id");
 
    // Only track if customer ID and amount are present
    if (customerId && amount) {
      // Track the sale event
      dubAnalytics.trackSale({
        eventName: "Purchase",
        customerExternalId: customerId,
        amount: parseInt(amount), // Amount in cents
        invoiceId: invoiceId || undefined,
        currency: "usd", // Customize as needed
        paymentProcessor: "stripe", // Customize as needed
      });
    }
  })();
</script>

Настройте срабатывание тега на определённых страницах, создав триггер Page View с условиями:

• Тип триггера: Page View
• Триггер срабатывает при: Some Page Views
• Добавьте условия, например:
  • Page URL содержит /order-confirmation
  • Или Page Path равен /checkout/success
  • Или любой другой шаблон URL, соответствующий вашим страницам подтверждения заказа

Назовите этот тег “Revroute Sales Tracking - Order Confirmation” и сохраните его.

Вариант 2: Отслеживание отправки формы оформления заказа

Этот метод отслеживает продажи сразу при заполнении формы оформления заказа на вашем сайте. Обратите внимание, что этот подход может быть менее надёжным из-за блокировщиков рекламы и проблем с таймингом.

Создайте тег Custom HTML со следующим кодом:

<script>
  (function () {
    // Get checkout data - customize these selectors based on your form
    var customerId = document.getElementById("customer_id")
      ? document.getElementById("customer_id").value
      : "";
    var amount = document.getElementById("amount")
      ? document.getElementById("amount").value
      : "";
    var invoiceId = document.getElementById("invoice_id")
      ? document.getElementById("invoice_id").value
      : "";
 
    // Only track if customer ID and amount are present
    if (customerId && amount) {
      // Track the sale event
      dubAnalytics.trackSale({
        eventName: "Purchase",
        customerExternalId: customerId,
        amount: parseInt(amount), // Amount in cents
        invoiceId: invoiceId || undefined,
        currency: "usd", // Customize as needed
        paymentProcessor: "stripe", // Customize as needed
      });
    }
  })();
</script>

Настройте срабатывание тега по Form Submission, создав новый триггер:

• Тип триггера: Form Submission
• Триггер срабатывает при: Some Forms (или All Forms, если хотите отслеживать все отправки форм)
• Добавьте условия для указания, какие формы должны активировать отслеживание продаж (например, формы оформления заказа)

Назовите этот тег “Revroute Sales Tracking - Checkout Form” и сохраните его.

Тестирование настройки

Для тестирования настройки GTM можно использовать режим Preview в Google Tag Manager:

1. Включите режим предпросмотра: в рабочей области GTM нажмите кнопку Preview в правом верхнем углу
2. Введите URL вашего сайта и нажмите Connect
3. Протестируйте выбранный метод отслеживания:
   • Для варианта 1 (подтверждение заказа): перейдите на страницу подтверждения заказа с параметрами запроса (например, ?customer_id=123&amount=1000&invoice_id=inv_456)
   • Для варианта 2 (отправка формы): перейдите на страницу оформления заказа и заполните тестовую форму покупки
4. Проверьте отладчик GTM, чтобы убедиться, что теги срабатывают правильно

Проверка отслеживания конверсий

Вы также можете проверить, что события конверсий отслеживаются:

1. Проверка консоли разработчика браузера на наличие ошибок JavaScript
2. Использование вкладки Network для проверки отправки запросов на эндпоинт аналитики Revroute
3. Просмотр дашборда Revroute для подтверждения, что события продаж отображаются в аналитике

Распространённые советы по устранению проблем

• Тег не срабатывает: проверьте правильность настройки триггеров и соответствие условий структуре вашей страницы
• Данные формы не захватываются (вариант 2): убедитесь, что DOM-селекторы соответствуют реальным идентификаторам полей формы оформления заказа
• Отсутствуют параметры запроса (вариант 1): убедитесь, что процесс оформления заказа перенаправляет на страницу подтверждения с необходимыми параметрами запроса
• Формат суммы: убедитесь, что суммы указаны в центах (например, $10.00 = 1000 центов)
• Множественные события: убедитесь, что теги не срабатывают несколько раз, проверив условия триггеров
• Дублирование отслеживания: убедитесь, что реализован только один метод отслеживания (вариант 1 ИЛИ вариант 2, но не оба)
• Отсутствует публичный ключ: убедитесь, что вы заменили плейсхолдер на реальный публичный ключ

Просмотр результатов конверсий

Вот и всё — настройка завершена! Теперь вы можете наблюдать за ростом дохода от конверсий. Мы предоставляем 3 различных представления для анализа ваших конверсий: