Интеграция Hotjar с 1С-Битрикс

Интеграция Hotjar с 1С-Битрикс

Hotjar записывает сессии пользователей, строит тепловые карты кликов и движений мыши, собирает ответы на опросы прямо на странице. Для интернет-магазина на Битрикс это инструмент ответа на вопрос «что делают пользователи», который не объясняет Яндекс.Метрика. Установка проще, чем у большинства аналитических инструментов — сложнее правильно настроить под Битрикс-специфику.

Установка трекинг-кода

<!-- В шаблоне Битрикс, перед </head> или перед </body> -->
<script>
(function(h,o,t,j,a,r){
    h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
    h._hjSettings={hjid: YOUR_HJID, hjsv: 6};
    a=o.getElementsByTagName('head')[0];
    r=o.createElement('script');r.async=1;
    r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
    a.appendChild(r);
})(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
</script>

В Битрикс добавляйте через Настройки → Настройки продукта → JS-фрагменты или в файл шаблона. Используйте «до закрывающего </head>» — так Hotjar начинает загружаться как можно раньше и не пропускает начало сессии.

Идентификация авторизованного пользователя

Hotjar поддерживает идентификацию пользователей через hj('identify', userId, attributes). Это позволяет фильтровать записи сессий по атрибутам и строить тепловые карты только для определённых сегментов.

<?php if ($USER->IsAuthorized()):
    $userId        = $USER->GetID();
    $ordersCount   = getUserOrdersCount($userId);
    $totalSpent    = getUserTotalSpent($userId);
    $loyaltyLevel  = getUserLoyaltyLevel($userId);
?>
<script>
window.hj = window.hj || function(){(hj.q=hj.q||[]).push(arguments)};
hj('identify', <?= $userId ?>, {
    email:         <?= json_encode($USER->GetEmail()) ?>,
    orders_count:  <?= $ordersCount ?>,
    total_spent:   <?= $totalSpent ?>,
    loyalty_level: <?= json_encode($loyaltyLevel) ?>,
    is_b2b:        <?= getUserIsB2B($userId) ? 'true' : 'false' ?>,
});
</script>
<?php endif; ?>

После этого в интерфейсе Hotjar можно фильтровать записи: «покажи только сессии пользователей с orders_count > 5» или «только B2B-пользователи». Это радикально сокращает время на анализ.

Настройка событий для тепловых карт

По умолчанию Hotjar строит тепловые карты по URL страниц. Для Битрикс это работает корректно на статических страницах, но есть нюансы:

Фасетный фильтр изменяет URL. catalog.smart.filter добавляет параметры фильтра в URL — /catalog/electronics/filter/price-from-1000-to-5000/. Hotjar будет создавать отдельную тепловую карту для каждой комбинации фильтра. Решение: в настройках Hotjar создайте правило группировки страниц — «все URL, содержащие /catalog/electronics/filter/» объединяются в одну тепловую карту.

Пагинация. /catalog/?PAGEN_1=2 — отдельная тепловая карта. Аналогично — создайте правило группировки для пагинированных страниц.

Динамические страницы корзины и оформления. sale.order.ajax меняет содержимое без смены URL. Hotjar корректно это обрабатывает — записывает изменения DOM. Но тепловая карта показывает клики на всех состояниях страницы вместе. Используйте записи сессий для анализа конкретных шагов оформления.

Отправка событий в Hotjar

Для маркировки ключевых действий в записях сессий:

// Добавление в корзину
function onAddToCart(productId, productName) {
    hj('event', 'add_to_cart');
    hj('tagRecording', ['add_to_cart', 'product-' + productId]);
}

// Начало оформления заказа
hj('event', 'checkout_started');

// Ошибка в форме оформления
hj('event', 'checkout_form_error');
hj('tagRecording', ['checkout_error']);

Теги tagRecording позволяют фильтровать записи в Hotjar: «покажи только сессии, где был тег checkout_error» — это мгновенно выделяет проблемные пользовательские пути.

Настройка опросов на Битрикс

Hotjar Surveys работает без дополнительной интеграции — настраивается в интерфейсе Hotjar по условиям отображения (URL, время на странице, процент прокрутки). Для Битрикс-специфичных сценариев:

Опрос после оформления заказа. Условие: страница /order/success/ или URL содержит ?ORDER_ID=. Вопрос: «Что чуть не помешало вам оформить заказ?»

Опрос при брошенной корзине. Условие: страница /basket/, пользователь собирается покинуть страницу (exit intent). Вопрос: «Не нашли то, что искали?»

Соответствие требованиям GDPR и ФЗ-152

Hotjar записывает сессии пользователей — это персональные данные. Необходимо:

1. Добавить Hotjar в политику конфиденциальности
2. Реализовать согласие пользователя (cookie-баннер)
3. Инициализировать Hotjar только после получения согласия:

// Инициализируем Hotjar только после согласия
document.addEventListener('cookieConsentGiven', function() {
    (function(h,o,t,j,a,r){ /* ... код Hotjar ... */ })();
});

В Битрикс cookie-согласие реализуется через стандартный компонент bitrix:main.cookie.agreement или кастомный баннер.

Исключение административной части

Hotjar не должен записывать сессии в /bitrix/admin/:

if (window.location.pathname.indexOf('/bitrix/admin') === -1 &&
    window.location.pathname.indexOf('/area51') === -1) {
    // инициализация Hotjar
}

Состав работ и сроки

• Установка трекинг-кода, cookie-согласие — 4–8 часов
• Идентификация пользователей, передача атрибутов — 4 часа
• Настройка правил группировки страниц (фильтры, пагинация) — 2–4 часа
• Настройка событий и тегов записей — 4–8 часов
• Первый анализ тепловых карт и записей — через 1–2 недели после запуска

Итого на интеграцию — 2–3 рабочих дня. Анализ и выводы — регулярный процесс, а не разовая работа.