Установка тега

Код#

Вставьте код перед </head> на всех страницах сайта. Код с ключом вашего сайта кабинет показывает после добавления сайта.

<script>
  window.dara = window.dara || function () { (dara.q = dara.q || []).push(arguments); };
</script>
<script async src="https://analytics.daratech.ru/t/as_XXXXXXXXXXXXXXXXXXXX.js"></script>
<noscript><img src="https://analytics.daratech.ru/c/p?k=as_XXXXXXXXXXXXXXXXXXXX" width="1" height="1" alt=""></noscript>

• Первый script создаёт функцию dara и очередь: команды, вызванные до загрузки тега, выполнятся, когда он загрузится.
• Второй script загружает тег асинхронно — страница его не ждёт. Вместе с тегом приходят настройки сайта: домены и режим одностраничного приложения. Изменения настроек доходят до страниц за 5 минут, переустанавливать код не нужно.
• noscript — пиксель для браузеров без JavaScript. Он даёт только просмотр страницы, без источника по UTM-меткам. Адрес страницы пиксель берёт из заголовка Referer, а браузеры по умолчанию передают в нём стороннему сайту только адрес сайта без пути, поэтому такие просмотры в отчётах обычно выглядят как просмотры главной страницы. Если политика сайта запрещает Referer совсем, просмотр по пикселю не учитывается.

Ключ сайта as_… публичный: он виден в коде страницы и только указывает сайт. Неизвестный или заблокированный ключ получает пустой скрипт — страница не увидит ошибку.

Что делает тег#

Тег отправляет события пачками — раз в 5 секунд, по 20 событий, при скрытии вкладки и уходе со страницы.

• Активное время — время, когда вкладка видима и посетитель взаимодействовал со страницей в последние 30 секунд.
• Персональные данные в адресах. В адресе страницы, реферере, заголовке и адресах ссылок тег заменяет на * значения, похожие на email или телефон, и значения параметров с именами email, mail, phone, tel, name, fio, password, pass, token. Страница /subscribe?email=user@example.com попадёт в отчёты как /subscribe?email=*. Телефоном считается номер с + в начале (+7 900 000-00-00) или российский номер, который начинается с 7 или 8 и разделён на группы пробелами, скобками или дефисами (8 (900) 000-00-00). Числа без таких разделителей — номера заказов, id товаров вроде ?id=1234567 — не заменяются. Сервер повторяет ту же проверку. Адрес ссылки-контакта — tel:, mailto:, ссылки мессенджеров — передаётся без замены: это контакт самого сайта, и без него отчёт «Контакты» бесполезен.
• Роботы. Тег передаёт признаки автоматизации браузера, а решение «робот или нет» принимает сервер. По умолчанию роботы в отчёты не попадают.

Тег не ломает страницу: весь его код выполняется внутри try/catch, из глобальных имён он добавляет только dara, не ставит полифилов и не выполняет синхронных задач дольше 50 мс.

Браузеры: версии за последние 2 года Chrome, Яндекс Браузера, Edge, Opera, Firefox и Safari (iOS 15 и новее). В старых браузерах считаются только просмотры.

Установка в CMS#

Tilda#

1. Откройте «Настройки сайта» → «Вставка кода» → «HTML-код для вставки внутрь head».
2. Вставьте код и сохраните.
3. Переопубликуйте все страницы: без этого код на страницах не появится.

1С-Битрикс#

1. В административном разделе откройте «Настройки» → «Настройки продукта» → «Сайты» → «Шаблоны сайтов».
2. Откройте шаблон, который использует сайт, и на вкладке «Шаблон» вставьте код перед </head>. Это тот же файл header.php в каталоге шаблона — /local/templates/{шаблон}/ или /bitrix/templates/{шаблон}/, его можно править и напрямую.
3. Если у сайта несколько шаблонов — например, отдельный для мобильной версии или посадочных страниц, — вставьте код в каждый.
4. Сбросьте кеш: «Настройки» → «Настройки продукта» → «Автокеширование» → «Очистка файлов кеша».

WordPress#

Файлы темы перезаписываются при её обновлении, поэтому добавьте код в дочернюю тему или через плагин вставки кода в head. В functions.php дочерней темы:

<?php
add_action('wp_head', function () {
    ?>
<script>
  window.dara = window.dara || function () { (dara.q = dara.q || []).push(arguments); };
</script>
<script async src="https://analytics.daratech.ru/t/as_XXXXXXXXXXXXXXXXXXXX.js"></script>
<noscript><img src="https://analytics.daratech.ru/c/p?k=as_XXXXXXXXXXXXXXXXXXXX" width="1" height="1" alt=""></noscript>
    <?php
}, 1);

Если на сайте стоит плагин кеширования страниц, очистите его кеш.

OpenCart#

1. Откройте шаблон шапки common/header.twig: в административном разделе — «Дизайн» → «Редактор темы», или файлом на сервере — catalog/view/theme/{тема}/template/common/header.twig в OpenCart 3, catalog/view/template/common/header.twig в OpenCart 4 со стандартной темой.
2. Вставьте код перед </head> и сохраните.
3. Если изменения не видны на сайте, обновите кеш тем в настройках разработчика на главной странице административного раздела.

InSales#

1. Откройте «Сайт» → «Счетчики и коды».
2. Добавьте блок кода для всех страниц сайта с размещением «В раздел head» и вставьте в него код.
3. Сохраните изменения.

Другие сайты#

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

CSP сайта#

Если сайт отдаёт заголовок Content-Security-Policy, разрешите в нём адрес https://analytics.daratech.ru:

Пример заголовка:

Content-Security-Policy: default-src 'self'; script-src 'self' 'nonce-4f9a1c7e' https://analytics.daratech.ru; connect-src 'self' https://analytics.daratech.ru; img-src 'self' https://analytics.daratech.ru

• Если в политике уже есть эти директивы, добавьте адрес к ним. Если директивы нет, для неё действует default-src — тогда добавьте директиву явно.
• Первый script кода — встроенный. Если политика запрещает встроенные скрипты, добавьте ему атрибут nonce с одноразовым значением страницы: <script nonce="…">.
• Если в script-src есть 'strict-dynamic', адреса доменов в этой директиве не действуют: браузер загрузит тег, только если у второго script тоже есть nonce. Скрипты, которые загружает сам тег, после этого разрешаются без отдельных правил.
• «Проверка установки» показывает признаки блокировки CSP: если они есть, сверьте заголовок с таблицей.

Код тега с nonce для политики с 'strict-dynamic' — значение nonce сервер сайта создаёт заново для каждой страницы:

<script nonce="4f9a1c7e">
  window.dara = window.dara || function () { (dara.q = dara.q || []).push(arguments); };
</script>
<script nonce="4f9a1c7e" async src="https://analytics.daratech.ru/t/as_XXXXXXXXXXXXXXXXXXXX.js"></script>
<noscript><img src="https://analytics.daratech.ru/c/p?k=as_XXXXXXXXXXXXXXXXXXXX" width="1" height="1" alt=""></noscript>

Одностраничные приложения#

По умолчанию тег считает просмотром страницы:

• вызовы history.pushState и history.replaceState;
• переход назад и вперёд по истории (popstate).

Реферер у такого просмотра — предыдущий адрес в приложении.

Смена #фрагмента адреса по умолчанию просмотром не считается. Если приложение построено на хеш-адресах, включите учёт смены #hash в настройках сайта, в разделе «Общие»: тогда фрагмент останется в адресе страницы в отчётах.

Просмотры вручную#

Если приложение меняет адрес без смены экрана — например, при выборе фильтра — и такие просмотры не нужны, выключите автоматический учёт в настройках сайта, в разделе «Общие», и отправляйте просмотры командой:

dara('page', {
  url: 'https://example.ru/catalog/shoes?page=2',
  title: 'Обувь — страница 2',
  referrer: 'https://example.ru/catalog/shoes'
});

Все поля необязательны.

Сайт на нескольких доменах#

• Домены сайта. Хиты принимаются только с основного и дополнительных доменов из настроек сайта; для каждого домена можно разрешить поддомены. Хиты с других доменов отбрасываются, а «Проверка установки» показывает чужой домен.
• Один код. Поставьте один и тот же код — с одним ключом сайта — на все домены. Тогда отчёты по ним общие.
• Переходы между доменами. К ссылкам на дополнительные домены тег добавляет параметр _dara={id посетителя}.{unix-время}. На другом домене тег принимает параметр, если ему не больше 120 секунд, и сразу убирает его из адресной строки. Так посетитель остаётся одним и тем же, а не становится новым на каждом домене.
• Разные проекты на разных доменах лучше заводить отдельными сайтами: у каждого будут свои отчёты, настройки и доступы.

События#

Команда dara('event', name, params?) отправляет произвольное событие — например, запуск видео или открытие калькулятора:

dara('event', 'video_play', { video: 'intro', position: 30 });

• name — имя события, до 128 знаков. В отчётах оно видно в измерении «Событие», а число событий — в метрике «События».
• params — необязательный объект до 2 КБ. Значение параметра видно в измерении «Параметр события».
• Значения в params, похожие на email или телефон, и значения параметров с именами email, mail, phone, tel, name, fio, password, pass, token тег и сервер заменяют на *.

Команда ready#

dara('ready', callback) вызывает функцию после загрузки тега и передаёт в неё id посетителя — значение cookie _dara_a:

dara('ready', function (info) {
  var input = document.querySelector('#order-form input[name="visitor_id"]');
  if (input) {
    input.value = info.visitor_id;
  }
});

Так id посетителя можно передать на сервер сайта вместе с формой заявки.