Различия

Показаны различия между двумя версиями страницы.

Ссылка на это сравнение

Предыдущая версия справа и слева Предыдущая версия
tlpro:integrations [2025/10/13 11:14]
n.zalozin [Настройка для фрейма Ticketland]
tlpro:integrations [2025/10/13 11:20] (текущий)
n.zalozin
Строка 218: Строка 218:
 <WRAP center round tip 60%> <WRAP center round tip 60%>
 💡 **Совет:** Для сложных случаев интеграции обратитесь к технической документации или в поддержку сервисов 💡 **Совет:** Для сложных случаев интеграции обратитесь к технической документации или в поддержку сервисов
-</WRAP> 
- 
- 
- 
- 
- 
- 
- 
- 
- 
- 
-====== Настройка счетчика Яндекс.Метрики на сайте ====== 
- 
-**Яндекс.Метрика** — это сервис веб-аналитики, который позволяет собирать данные о посещаемости сайта и поведении пользователей. Данная инструкция описывает полный процесс настройки счетчика. 
- 
-<WRAP center round info 60%> 
-**Целевая аудитория:** маркетологи, веб-мастера, администраторы сайтов 
-**Время выполнения:** 20-40 минут 
-**Уровень сложности:** начальный-средний 
-</WRAP> 
- 
-===== Оглавление ===== 
- 
-  - [[#предварительные_требования|Предварительные требования]] 
-  - [[#создание_счетчика|Создание счетчика]] 
-  - [[#установка_на_сайт|Установка на сайт]] 
-  - [[#проверка_работы|Проверка работы]] 
-  - [[#дополнительные_настройки|Дополнительные настройки]] 
-  - [[#решение_проблем|Решение проблем]] 
-  - [[#часто_задаваемые_вопросы|Часто задаваемые вопросы]] 
- 
-===== Предварительные требования ===== 
- 
-  * **Учетная запись Яндекс** (Яндекс.ID) 
-    - Если нет: [[https://ya.ru|зарегистрируйтесь]] 
-    - Рекомендуется использовать корпоративную почту 
- 
-  * **Доступ к сайту:** 
-    - Права администратора CMS 
-    - Доступ к FTP/хостинг-панели 
-    - Возможность редактирования HTML-кода 
- 
-  * **Информация о сайте:** 
-    - Доменное имя сайта 
-    - Часовой пояс посетителей 
-    - IP-адреса сотрудников (для фильтрации) 
- 
-===== Создание счетчика ===== 
- 
-=== Шаг 1: Начало создания === 
- 
-  1. Перейдите на [[https://metrika.yandex.ru/|сайт Яндекс.Метрики]] 
-  2. Нажмите кнопку **"Добавить счетчик"** 
-  3. Авторизуйтесь, если потребуется 
- 
-=== Шаг 2: Основные настройки === 
- 
-Заполните обязательные поля: 
- 
-| **Параметр** | **Значение** | **Пример** | **Примечание** | 
-|-------------|--------------|------------|----------------| 
-| **Имя счетчика** | Уникальное имя | "Основной сайт company.com" | Для удобной идентификации | 
-| **Адрес сайта** | Доменное имя | `example.ru` | Без http/https | 
-| **Часовой пояс** | Ваш регион | Москва, +3 GMT | Для корректной статистики | 
-| **Владелец счетчика** | Ответственный | Иванов И.И. | Кто управляет счетчиком | 
- 
-=== Шаг 3: Дополнительные настройки === 
- 
-<code> 
-[✓] Вебвизор, карта скроллинга, аналитика форм 
-[✓] Автоматические цели   
-[✓] Яндекс.Директ (если используется) 
-[ ] Электронная коммерция (только для магазинов) 
-[✓] Информация о технологиях посетителей 
-</code> 
- 
-=== Шаг 4: Важные настройки безопасности === 
- 
-В разделе **"Дополнительные настройки"**: 
- 
-<code> 
-[x] Принимать данные только с указанных адресов 
-[x] Не сохранять полные IP-адреса посетителей   
-[x] Включить фильтр роботов 
-[x] Учитывать только определенные домены 
-</code> 
- 
-=== Шаг 5: Завершение создания === 
- 
-  1. Примите условия пользовательского соглашения 
-  2. Нажмите **"Создать счетчик"** 
-  3. Сохраните номер счетчика (пример: 12345678) 
- 
-<WRAP center round important 60%> 
-❗ **Запишите номер счетчика** - он понадобится для дальнейшей настройки 
-</WRAP> 
- 
-===== Установка на сайт ===== 
- 
-=== Способ 1: Прямая установка в HTML-код === 
- 
-**Полный код для вставки:** 
- 
-<code html> 
-<!-- Yandex.Metrika counter --> 
-<script type="text/javascript" > 
-   (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; 
-   m[i].l=1*new Date(); 
-   for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }} 
-   k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)}) 
-   (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym"); 
- 
-   ym(12345678, "init", { 
-        clickmap:true, 
-        trackLinks:true, 
-        accurateTrackBounce:true, 
-        webvisor:true, 
-        ecommerce:"dataLayer" 
-   }); 
-</script> 
-<noscript><div><img src="https://mc.yandex.ru/watch/12345678" style="position:absolute; left:-9999px;" alt="" /></div></noscript> 
-<!-- /Yandex.Metrika counter --> 
-</code> 
- 
-**Место установки:** 
-  - Внутри тега `<head>` 
-  - Как можно ближе к началу страницы 
-  - На **всех** страницах сайта 
- 
-=== Способ 2: Установка через популярные CMS === 
- 
-**WordPress:** 
-  1. Установите плагин "Yandex.Metrica Counter" 
-  2. Перейдите в "Настройки" → "Яндекс.Метрика" 
-  3. Введите номер счетчика в поле "ID счетчика" 
-  4. Сохраните изменения 
- 
-**1C-Битрикс:** 
-  1. Перейдите в "Маркетинг" → "Веб-аналитика" 
-  2. Нажмите "Добавить счетчик" 
-  3. Выберите "Яндекс.Метрика" 
-  4. Заполните настройки аналогично веб-версии 
- 
-**Joomla:** 
-  1. Установите расширение "Yandex Metrika" 
-  2. В настройках компонента укажите номер счетчика 
-  3. Настройте дополнительные параметры 
- 
-**Tilda:** 
-  1. Откройте настройки сайта 
-  2. Перейдите в "Аналитика" 
-  3. Введите номер счетчика в поле "Яндекс.Метрика" 
-  4. Сохраните изменения 
- 
-=== Способ 3: Установка через конструкторы === 
- 
-**Wix:** 
-  1. Перейдите в "Настройки" → "Tracking & Analytics" 
-  2. Нажмите "Добавить новый инструмент" → "Яндекс.Метрика" 
-  3. Введите номер счетчика 
- 
-**Shopify:** 
-  1. Перейдите в "Настройки" → "Checkout" 
-  2. В разделе "Дополнительные скрипты" вставьте код 
-  3. Сохраните изменения 
- 
-<WRAP center round tip 60%> 
-💡 **Рекомендация:** Для WordPress и Joomla используйте официальные плагины - они автоматически обновляют код при изменении настроек 
-</WRAP> 
- 
-===== Проверка работы ===== 
- 
-=== Метод 1: Проверка через консоль браузера === 
- 
-  1. Откройте сайт в браузере 
-  2. Добавьте к URL параметр: `?__ym_debug=2` 
-     - Пример: `https://example.com/?__ym_debug=2` 
-  3. Откройте консоль разработчика (F12 → Console) 
-  4. Убедитесь, что видите сообщение: 
- 
-<code javascript> 
-[Яндекс.Метрика] counter 12345678 hit https://example.com/ 
-[Яндекс.Метрика] counter 12345678 params: {...} 
-</code> 
- 
-=== Метод 2: Проверка в интерфейсе Метрики === 
- 
-  1. Перейдите в [[https://metrika.yandex.ru/list|список счетчиков]] 
-  2. Напротив вашего счетчика должен быть **зеленый индикатор** 
-  3. Нажмите на счетчик → "Настройки" → "Проверка счетчика" 
-  4. Введите URL страницы и нажмите "Проверить" 
- 
-**Признаки корректной работы:** 
-  - ✅ Зеленый индикатор "Данные поступают" 
-  - ✅ В отчетах появляются визиты (через 2-4 часа) 
-  - ✅ Вебвизор записывает сессии (если включен) 
- 
-=== Метод 3: Проверка через Network === 
- 
-  1. Откройте вкладку "Network" (F12 → Network) 
-  2. Обновите страницу (F5) 
-  3. Найдите запросы к `mc.yandex.ru` 
-  4. Убедитесь, что статус ответа 200 OK 
- 
-<WRAP center round important 60%> 
-❗ **Первые данные** появятся через 2-4 часа. **Полная статистика** будет доступна через 24 часа после установки 
-</WRAP> 
- 
-===== Дополнительные настройки ===== 
- 
-=== Настройка целей === 
- 
-**Пример цели: "Отправка формы заявки"** 
- 
-  1. **В интерфейсе Метрики:** 
-     - Цели → Добавить цель 
-     - Название: "Отправка формы заявки" 
-     - Тип условия: "JavaScript-событие" 
-     - Идентификатор цели: `form_success` 
- 
-  2. **В код сайта добавьте:** 
- 
-<code html> 
-<script> 
-// Для стандартной формы 
-document.getElementById('contact-form').addEventListener('submit', function() { 
-    ym(12345678, 'reachGoal', 'form_success'); 
-}); 
- 
-// Для AJAX формы 
-function trackFormSuccess() { 
-    ym(12345678, 'reachGoal', 'form_success'); 
-} 
-</script> 
-</code> 
- 
-**Автоматические цели (уже включены):** 
-  - Клики по email: `mailto:` 
-  - Клики по телефонам: `tel:` 
-  - Скачивание файлов: `.pdf, .doc, .zip` 
-  - Внешние ссылки 
- 
-=== Настройка фильтров === 
- 
-**Исключение сотрудников:** 
- 
-  1. Перейдите в "Фильтры" → "Добавить фильтр" 
-  2. Настройте фильтр: 
- 
-<code> 
-Тип: Исключить 
-Поле: IP-адрес 
-Значение: 192.168.1.1, 192.168.1.100-192.168.1.200 
-Название: "Исключить офис" 
-</code> 
- 
-  3. Включите опцию **"Не учитывать мои визиты"** 
- 
-=== Настройка вебвизора === 
- 
-**Рекомендуемые параметры:** 
-  - ✅ Запись сессий 
-  - ✅ Карта кликов 
-  - ✅ Аналитика форм 
-  - ❌ Запись авторизованных пользователей (по необходимости) 
-  - ✅ Запись посещений с мобильных устройств 
- 
-===== Решение проблем ===== 
- 
-=== Проблема: Счетчик не собирает данные === 
- 
-**Диагностика:** 
-  1. Проверьте наличие кода на странице (ПКМ → Посмотреть код) 
-  2. Проверьте консоль на ошибки (F12 → Console) 
-  3. Проверьте с отключенными блокировщиками 
- 
-**Решение:** 
-  - Переустановите код счетчика 
-  - Проверьте правильность номера счетчика 
-  - Отключите AdBlock на вашем сайте 
- 
-=== Проблема: Не работает вебвизор === 
- 
-**Причины:** 
-  - Опция не была включена при создании 
-  - Не обновлен код после включения опции 
-  - IP-адрес исключен через фильтры 
- 
-**Решение:** 
-  1. Проверьте настройки счетчика 
-  2. Обновите код на сайте 
-  3. Проверьте фильтры IP-адресов 
- 
-=== Проблема: Неверные данные в отчетах === 
- 
-**Возможные причины:** 
-  - Не настроены фильтры 
-  - Дублирование кода счетчика 
-  - Кэширование страниц 
-  - Разные часовые пояса 
- 
-=== Проблема: Ошибка "Counter not found" === 
- 
-**Решение:** 
-  - Проверьте правильность номера счетчика 
-  - Убедитесь, что счетчик не удален 
-  - Проверьте доступ к аккаунту 
- 
-===== Часто задаваемые вопросы ===== 
- 
-=== ❓ Сколько времени нужно для появления данных? === 
-Первые данные появляются через 2-4 часа после установки. Полная статистика доступна через 24 часа. 
- 
-=== ❓ Нужно ли обновлять код после изменения настроек? === 
-**Да!** При изменении настроек (включение вебвизора и т.д.) необходимо заменить код на сайте. 
- 
-=== ❓ Как отслеживать динамику посещений? === 
-Используйте отчет "Посещаемость" в разделе "Стандартные отчеты" → "Отчеты по посещаемости". 
- 
-=== ❓ Можно ли установить несколько счетчиков? === 
-Да, можно установить несколько счетчиков для разных отделов или целей. 
- 
-=== ❓ Как настроить электронную коммерцию? === 
-Требуется дополнительная настройка JavaScript. См. [[https://yandex.ru/support/metrica/e-commerce/|документацию по e-commerce]]. 
- 
-===== Полезные ссылки ===== 
- 
-  - [[https://yandex.ru/support/metrica/|Официальная документация Яндекс.Метрики]] 
-  - [[https://yandex.ru/support/metrica/api/|Справочник по API]] 
-  - [[https://yandex.ru/support/metrica/feedback.html|Форум поддержки]] 
-  - [[https://metrika.yandex.ru/list|Личный кабинет Метрики]] 
- 
-<WRAP center round tip 60%> 
-📊 **Совет:** Регулярно проверяйте статистику и настраивайте новые цели для улучшения эффективности сайта 
-</WRAP> 
- 
-**Дата последнего обновления:** 26.09.2025   
- 
- 
- 
-====== Настройка счетчика Яндекс.Метрики для фрейма Ticketland ====== 
- 
-**Особенности настройки счетчика для встраиваемого фрейма Ticketland** требуют специального подхода, так как фрейм работает в изолированном контексте. 
- 
-<WRAP center round important 60%> 
-❗ **ВАЖНО:** Для корректного отслеживания в фрейме требуется дополнительная настройка, отличная от стандартной установки на сайте. 
-</WRAP> 
- 
-===== Особенности отслеживания в iframe ===== 
- 
-=== Проблемы стандартной установки === 
- 
-При обычной установке кода Яндекс.Метрики в iframe могут возникнуть следующие проблемы: 
- 
-  * **Потеря данных** о источниках трафика 
-  * **Некорректное определение** рефереров 
-  * **Проблемы с cookies** и идентификацией посетителей 
-  * **Ограничения браузеров** для кросс-доменных iframe 
- 
-=== Рекомендуемое решение === 
- 
-**Использование параметров URL для передачи данных** из родительской страницы во фрейм. 
- 
-===== Настройка счетчика для фрейма ===== 
- 
-=== Шаг 1: Создание отдельного счетчика === 
- 
-Рекомендуется создать **отдельный счетчик** специально для фрейма: 
- 
-  1. Перейдите в [[https://metrika.yandex.ru/list|Яндекс.Метрику]] 
-  2. Нажмите "Добавить счетчик" 
-  3. Настройки: 
-     - **Имя счетчика:** "Фрейм Ticketland - [название сайта]" 
-     - **Адрес сайта:** Укажите основной домен сайта 
-     - **Часовой пояс:** Ваш регион 
- 
-=== Шаг 2: Модификация кода iframe === 
- 
-Добавьте параметры в URL фрейма для передачи данных из родительской страницы: 
- 
-<code html> 
-<!-- Стандартный код iframe --> 
-<iframe src="https://ticketland.ru/widget?event=123"></iframe> 
- 
-<!-- Модифицированный код с передачей параметров --> 
-<iframe src="https://ticketland.ru/widget?event=123&ymuid=<?php echo $yandex_uid; ?>&ref=<?php echo urlencode($_SERVER['HTTP_REFERER']); ?>"></iframe> 
-</code> 
- 
-=== Шаг 3: Специальный код для фрейма === 
- 
-Используйте этот модифицированный код Яндекс.Метрики внутри фрейма: 
- 
-<code javascript> 
-<!-- Yandex.Metrika counter для фрейма --> 
-<script type="text/javascript"> 
-    // Получаем параметры из URL 
-    var urlParams = new URLSearchParams(window.location.search); 
-    var externalRef = urlParams.get('ref'); 
-    var externalYmuid = urlParams.get('ymuid'); 
- 
-    (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; 
-    m[i].l=1*new Date(); 
-    for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }} 
-    k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)}) 
-    (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym"); 
- 
-    // Настройка для фрейма с внешними параметрами 
-    ym(12345679, "init", { 
-        clickmap: true, 
-        trackLinks: true, 
-        accurateTrackBounce: true, 
-        webvisor: true, 
-        trackHash: true, 
-        ut: "noindex", 
-        // Передача внешних параметров 
-        params: { 
-            externalRef: externalRef || document.referrer, 
-            externalYmuid: externalYmuid 
-        } 
-    }); 
- 
-    // Специальная обработка для фрейма 
-    if (window.parent !== window) { 
-        ym(12345679, 'params', { 
-            iframe: true, 
-            parentHost: document.referrer ? new URL(document.referrer).hostname : 'direct' 
-        }); 
-    } 
-</script> 
-<noscript><div><img src="https://mc.yandex.ru/watch/12345679" style="position:absolute; left:-9999px;" alt="" /></div></noscript> 
-</code> 
- 
-=== Шаг 4: Передача данных между окнами === 
- 
-Для кросс-доменной коммуникации добавьте этот код на **родительскую страницу**: 
- 
-<code javascript> 
-// Код для родительской страницы 
-window.ticketlandFrameTracker = { 
-    init: function(iframeId) { 
-        var iframe = document.getElementById(iframeId); 
-        var ymuid = this.getYandexUid(); 
-         
-        // Обновляем src iframe с параметрами 
-        var src = iframe.src; 
-        if (src.indexOf('?') === -1) { 
-            src += '?'; 
-        } else { 
-            src += '&'; 
-        } 
-        src += 'ymuid=' + ymuid + '&ref=' + encodeURIComponent(document.referrer); 
-        iframe.src = src; 
-    }, 
-     
-    getYandexUid: function() { 
-        var matches = document.cookie.match(/_ym_uid=([^;]+)/); 
-        return matches ? matches[1] : ''; 
-    } 
-}; 
- 
-// Инициализация при загрузке фрейма 
-document.addEventListener('DOMContentLoaded', function() { 
-    window.ticketlandFrameTracker.init('ticketland-frame'); 
-}); 
-</code> 
- 
-===== Отслеживание конверсий в фрейме ===== 
- 
-=== Настройка целей для покупки билетов === 
- 
-**В интерфейсе Метрики создайте цели:** 
- 
-  1. **"Начало оформления заказа"** - когда пользователь выбирает билеты 
-  2. **"Заполнение данных"** - на этапе ввода персональных данных   
-  3. **"Успешная оплата"** - завершение покупки 
- 
-=== Код для отслеживания событий в фрейме === 
- 
-<code javascript> 
-// Пример отслеживания событий покупки 
-function trackTicketPurchase(eventData) { 
-    ym(12345679, 'reachGoal', 'ticket_purchase', { 
-        event_id: eventData.eventId, 
-        ticket_count: eventData.ticketCount, 
-        total_amount: eventData.amount, 
-        currency: eventData.currency 
-    }); 
-} 
- 
-// Отслеживание шагов воронки 
-function trackFunnelStep(stepName, stepData) { 
-    ym(12345679, 'params', { 
-        funnel_step: stepName, 
-        step_data: JSON.stringify(stepData) 
-    }); 
-} 
-</code> 
- 
-===== Решение специфических проблем фрейма ===== 
- 
-=== Проблема: Блокировка третьих-party cookies === 
- 
-**Решение:** Использование первого-party cookies через прокси: 
- 
-<code javascript> 
-// Альтернативный метод идентификации 
-var visitorId = generateVisitorId(); // Генерация собственного ID 
-ym(12345679, 'userParams', { 
-    VisitorID: visitorId, 
-    FirstVisit: new Date().toISOString() 
-}); 
-</code> 
- 
-=== Проблема: Потеря источника трафика === 
- 
-**Решение:** Явная передача UTM-меток: 
- 
-<code javascript> 
-// Передача UTM-параметров 
-var utmParams = { 
-    utm_source: getUrlParam('utm_source'), 
-    utm_medium: getUrlParam('utm_medium'), 
-    utm_campaign: getUrlParam('utm_campaign') 
-}; 
- 
-ym(12345679, 'params', utmParams); 
-</code> 
- 
-===== Проверка работы в фрейме ===== 
- 
-=== Методы отладки === 
- 
-  1. **Проверка в консоли фрейма:** 
-     - Откройте инструменты разработчика 
-     - Перейдите в контекст фрейма 
-     - Проверьте наличие запросов к mc.yandex.ru 
- 
-  2. **Проверка параметров:** 
-     - Добавьте `?__ym_debug=2` в URL фрейма 
-     - Проверьте передаваемые параметры 
- 
-  3. **Мониторинг в реальном времени:** 
-     - Используйте отчет "Мониторинг" в Метрике 
-     - Фильтруйте по hostname фрейма 
- 
-=== Пример корректной работы === 
- 
-<code> 
-[Яндекс.Метрика] counter 12345679 hit https://ticketland.ru/widget?event=123 
-[Яндекс.Метрика] Параметры: {externalRef: "https://example.com", iframe: true} 
-[Яндекс.Метрика] Цель достигнута: ticket_purchase 
-</code> 
- 
-===== Интеграция с электронной коммерцией ===== 
- 
-=== Настройка данных о покупках === 
- 
-Для точного отслеживания ROI настройте передачу данных о заказах: 
- 
-<code javascript> 
-// Передача данных о заказе 
-ym(12345679, 'reachGoal', 'purchase', { 
-    orderPrice: 2500, 
-    orderId: 'ORD-12345', 
-    currency: 'RUB', 
-    products: [ 
-        { 
-            id: 'TICKET-001', 
-            name: 'Билет на концерт', 
-            price: 1250, 
-            quantity: 2 
-        } 
-    ] 
-}); 
-</code> 
- 
-===== FAQ по фрейму Ticketland ===== 
- 
-=== ❓ Почему не отслеживаются посетители во фрейме? === 
-**Ответ:** Возможно, блокируются кросс-доменные запросы. Проверьте настройки CORS и используйте передачу параметров через URL. 
- 
-=== ❓ Как отслеживать источники трафика для фрейма? ===   
-**Ответ:** Передавайте referrer и UTM-метки через параметры URL при загрузке фрейма. 
- 
-=== ❓ Нужен ли отдельный счетчик для фрейма? === 
-**Ответ:** Рекомендуется использовать отдельный счетчик для чистоты данных и избежания дублирования. 
- 
-=== ❓ Как настроить цели для этапов покупки? === 
-**Ответ:** Используйте JavaScript-события на каждом этапе воронки покупки в коде фрейма. 
- 
-<WRAP center round tip 60%> 
-🎫 **Совет:** Регулярно тестируйте отслеживание, совершая тестовые покупки через фрейм и проверяя данные в реальном времени. 
-</WRAP> 
- 
- 
- 
- 
-====== Интеграции с виджетом ====== 
- 
-Продавая билеты на своём сайте, зачастую возникает потребность анализировать продажи средствами web-аналитики или отправлять данные в рекламные системы для оптимизации маркетинговых активностей. В данной инструкции вы узнаете, как интегрировать виджет с аналитикой и социальными сетями. 
-<WRAP center round important 60%> 
- 
 </WRAP> </WRAP>
  

tlpro/integrations.txt · Последнее изменение: 2025/10/13 11:20 — n.zalozin