Различия

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

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

Предыдущая версия справа и слева Предыдущая версия
Следующая версия
Предыдущая версия
tlpro:integrations [2025/09/26 13:30]
n.zalozin
tlpro:integrations [2025/10/13 11:20] (текущий)
n.zalozin
Строка 1: Строка 1:
-====== Настройка счетчика Яндекс.Метрики для фрейма Ticketland ======+====== Настройка Яндекс.Метрики для сайта и фрейма Ticketland ======
  
-**Особенности настройки счетчика для встраиваемого фрейма Ticketland** требуют специального подходатак как фрейм работает в изолированном контексте.+**Краткое руководство по установке и базовой настройке счетчика Яндексетрики**
  
-<WRAP center round important 60%> +<WRAP center round info 60%> 
-❗ **ВАЖНО:** Для корректного отслеживания в фрейме требуется дополнительная настройка, отличная от стандартной установки на сайте.+**Время настройки:** 15-30 минут    
 +**Необходимо:** доступ к редактированию кода сайта
 </WRAP> </WRAP>
  
-===== Особенности отслеживания в iframe =====+===== Быстрая навигация ===== 
 +  - [[#создание_счетчика|Создание счетчика]] 
 +  - [[#установка_на_сайт|Установка на сайт]] 
 +  - [[#настройка_для_фрейма_ticketland|Настройка для фрейма Ticketland]] 
 +  - [[#проверка_работы|Проверка работы]] 
 +  - [[#полезные_ссылки|Полезные ссылки]]
  
-=== Проблемы стандартной установки ===+===== Создание счетчика =====
  
-При обычной установке кода Яндекс.Метрики в iframe могут возникнуть следующие проблемы:+=== Шаг 1: Регистрация в Метрике ===
  
-  * **Потеря данных** о источниках трафика +  1. Перейдите в сервис 
-  * **Некорректное определение** рефереров +   
-  * **Проблемы с cookies** и идентификацией посетителей +[[https://metrika.yandex.ru/ндекс.Метрика]] 
-  * **Ограничения браузеров** для кроссоменных iframe+   
 +  2. Нажмите кнопку 
 +**обавить счетчик"** 
 +  3. Авторизуйтесь с помощью Яндекс.ID
  
-=== Рекомендуемое решение ===+=== Шаг 2: Основные настройки ===
  
-**Использование параметров URL для передачи данных** из родительской страницы во фрейм.+Заполните обязательные поля:
  
-===== Настройка счетчика для фрейма =====+| Параметр | Пример значения | Примечание | 
 +| **Имя счетчика** | `Основной сайт example.com` | Для идентификации в списке | 
 +| **Адрес сайта** | `example.ru` | Без http/https | 
 +| **Часовой пояс** | Москва, +3 GMT | Для корректного времени в отчетах | 
 +| **Владелец счетчика** | Иванов И.И. | Кто управляет счетчиком |
  
-=== Шаг 1Создание отдельного счетчика ===+=== Шаг 3Дополнительные опции ===
  
-Рекомендуется создать **отдельный счетчик** специально для фрейма:+Рекомендуемые настройки: 
 +<code> 
 +[✓] Вебвизор, карта скроллинга, аналитика форм 
 +[✓] Автоматические цели 
 +[✓] Яндекс.Директ (если используется) 
 +[ ] Электронная коммерция (только для магазинов) 
 +</code>
  
-  1. Перейдите в [[https://metrika.yandex.ru/list|Яндекс.Метрику]] +=== Шаг 4Завершение создания ===
-  2. Нажмите "Добавить счетчик" +
-  3. Настройки: +
-     - **Имя счетчика:** "Фрейм Ticketland - [название сайта]" +
-     - **Адрес сайта:** Укажите основной домен сайта +
-     - **Часовой пояс:** Ваш регион+
  
-=== Шаг 2: Модификация кода iframe ===+  1. Примите условия пользовательского соглашения 
 +  2. Нажмите кнопку 
 +**"Создать счетчик"** 
 +  3. Нажмите кнопку 
 +**"Сохраните номер счетчика"** 
 +     (например: 12345678)
  
-Добавьте параметры в URL фрейма для передачи данных из родительской страницы:+===== Установка на сайт =====
  
-<code html> +=== Базовый код для вставки ===
-<!-- Стандартный код iframe --> +
-<iframe src="https://ticketland.ru/widget?event=123"></iframe>+
  
-<!-- Модифицированный код с передачей параметров --> +Скопируйте этот код в тег `<head>` на всех страницах сайта:
-<iframe src="https://ticketland.ru/widget?event=123&ymuid=<?php echo $yandex_uid; ?>&ref=<?php echo urlencode($_SERVER['HTTP_REFERER']); ?>"></iframe> +
-</code>+
  
-=== Шаг 3: Специальный код для фрейма === +<code html
- +<!-- Yandex.Metrika counter -->
-Используйте этот модифицированный код Яндекс.Метрики внутри фрейма: +
- +
-<code javascript+
-<!-- Yandex.Metrika counter для фрейма -->+
 <script type="text/javascript"> <script type="text/javascript">
-    // Получаем параметры из URL +   (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}
-    var urlParams new URLSearchParams(window.location.search); +   m[i].l=1*new Date(); 
-    var externalRef = urlParams.get('ref'); +   k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)}) 
-    var externalYmuid urlParams.get('ymuid');+   (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
  
-    (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; +   ym(12345678, "init",
-    m[i].l=1*new Date(); +        clickmap:true, 
-    for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }} +        trackLinks:true, 
-    k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)}) +        accurateTrackBounce:true, 
-    (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym"); +        webvisor:true 
- +   });
-    // Настройка для фрейма с внешними параметрами +
-    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> </script>
-<noscript><div><img src="https://mc.yandex.ru/watch/12345679" style="position:absolute; left:-9999px;" alt="" /></div></noscript>+<noscript><div><img src="https://mc.yandex.ru/watch/12345678" style="position:absolute; left:-9999px;" alt="" /></div></noscript
 +<!-- /Yandex.Metrika counter -->
 </code> </code>
  
-=== Шаг 4: Передача данных между окнами ===+где 12345678 - ваш номер счетчика.
  
-Для кросс-доменной коммуникации добавьте этот код на **родительскую страницу**: 
  
-<code javascript+<WRAP center round important 60%
-// Код для родительской страницы +❗ **Внимание:** Если ваш сайт также использует Яндекс Метрику для аналитики, не используйте его номер счетчика для фрейма тикетленд. Создайте отдельный
-window.ticketlandFrameTracker = { +</WRAP> 
-    init: function(iframeId) { +=== Установка через CMS ===
-        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] : ''; +
-    } +
-};+
  
-// Инициализация при загрузке фрейма +**WordPress:** Используйте плагин "Yandex Metrica" или вставьте код в `header.php`  
-document.addEventListener('DOMContentLoaded', function() { +
-    window.ticketlandFrameTracker.init('ticketland-frame'); +
-}); +
-</code>+
  
-===== Отслеживание конверсий в фрейме =====+**1C-Битрикс:** Раздел "Маркетинг" → "Веб-аналитика"  
  
-=== Настройка целей для покупки билетов ===+**Tilda:** Настройки сайта → "Аналитика" → поле "Яндекс.Метрика"
  
-**В интерфейсе Метрики создайте цели:**+===== Настройка для фрейма Ticketland =====
  
-  1. **"Начало оформления заказа"** - когда пользователь выбирает билеты +=== 1. Добавление домена в счетчик ===
-  2. **"Заполнение данных"** - на этапе ввода персональных данных   +
-  3. **"Успешная оплата"** - завершение покупки+
  
-=== Код для отслеживания событий в фрейме ===+В настройках счетчика во вкладке **"Фильтры"** → **"Дополнительные адреса сайта"** добавьте
 +<code> 
 +ticketland.ru 
 +*.ticketland.ru 
 +</code>
  
-<code javascript> +=== 2. Базовый код фрейма ===
-// Пример отслеживания событий покупки +
-function trackTicketPurchase(eventData) { +
-    ym(12345679, 'reachGoal', 'ticket_purchase',+
-        event_id: eventData.eventId, +
-        ticket_count: eventData.ticketCount, +
-        total_amount: eventData.amount, +
-        currency: eventData.currency +
-    }); +
-}+
  
-// Отслеживание шагов воронки +<code html> 
-function trackFunnelStep(stepName, stepData) { +<div id="tl-widget-container"></div> 
-    ym(12345679, 'params', { +<script> 
-        funnel_stepstepName, +    var tlWidgetConfig = { 
-        step_data: JSON.stringify(stepData+        partner: 'your-partner-code', // Получить в Ticketland 
-    }); +        container: 'tl-widget-container', 
-}+        type: 'events' // или 'venues' в зависимости от типа 
 +    }; 
 +     
 +    (function() { 
 +        var script = document.createElement('script'); 
 +        script.src = 'https://widget.ticketland.ru/embed.js'; 
 +        document.head.appendChild(script); 
 +    })(); 
 +</script>
 </code> </code>
  
-===== Решение специфических проблем фрейма =====+=== 3. Отслеживание событий фрейма ===
  
-=== Проблема: Блокировка третьих-party cookies === +Добавьте этот код для отслеживания взаимодействий:
- +
-**Решение:** Использование первого-party cookies через прокси:+
  
 <code javascript> <code javascript>
-// Альтернативный метод идентификации +// Отслеживание загрузки фрейма 
-var visitorId = generateVisitorId(); // Генерация собственного ID +document.addEventListener('TL_WIDGET_LOADED', function() { 
-ym(12345679, 'userParams', +    ym(12345678, 'reachGoal', 'widget_loaded');
-    VisitorID: visitorId, +
-    FirstVisit: new Date().toISOString()+
 }); });
-</code> 
  
-=== Проблема: Потеря источника трафика === +// Отслеживание кликов по событиям 
- +document.addEventListener('TL_EVENT_CLICK', function(event) { 
-**Решение:** Явная передача UTM-меток: +    ym(12345678, 'reachGoal', 'event_click', { 
- +        event_id: event.detail.id, 
-<code javascript> +        event_name: event.detail.name 
-// Передача UTM-параметров +    })
-var utmParams = { +});
-    utm_source: getUrlParam('utm_source')+
-    utm_medium: getUrlParam('utm_medium'), +
-    utm_campaign: getUrlParam('utm_campaign') +
-}; +
- +
-ym(12345679, 'params', utmParams);+
 </code> </code>
  
-===== Проверка работы в фрейме =====+<del>=== 4. Цели для анализа продаж ===
  
-=== Методы отладки ===+Настройте в Метрике цели с типом **"JavaScript-событие"**:
  
-  1. **Проверка в консоли фрейма:** +| Цель | Идентификатор | Описание | 
-     Откройте инструменты разработчика +|------|---------------|----------| 
-     - Перейдите в контекст фрейма +| Просмотр события | `event_view` | Пользователь просмотрел страницу события | 
-     - Проверьте наличие запросов к mc.yandex.ru+| Выбор билетов | `ticket_select` | Пользователь выбрал билеты | 
 +| Начало оформления | `checkout_start` | Начало процесса оплаты | 
 +</del> 
 +===== Проверка работы =====
  
-  2. **Проверка параметров:** +=== Проверка счетчика на сайте ===
-     - Добавьте `?__ym_debug=1` в URL фрейма +
-     - Проверьте передаваемые параметры+
  
-  3**Мониторинг в реальном времени:** +  1Откройте сайт с параметром: `?__ym_debug=2` 
-     - Используйте отчет "Мониторинг" в Метрике +        
-     - Фильтруйте по hostname фрейма+      (возможно понадобится открыть в окне с отключенными блокировщиками рекламы и с разрешением на запуск скриптов)  
 +      В нижнем правом углу вашего сайта должен появиться значок Яндекс Метрики 
  
-=== Пример корректной работы ===+{{:tlpro:jametrika_ikonka_konsoli.jpg?nolink|Консоль Яндекс Метрики}} 
 +      
 +     При нажатии на него развернется консоль метрики с вашим активным счетчиком 
 +     
 +{{:tlpro:interfejs_jametriki.jpg?nolink|Интерфейс Яндекс Метрики}} 
 +      
 +      
 +  2. Нажмите F12 → Console
  
-<code> +  3. Должны увидеть`[Яндекс.Метрика] counter 12345678 hit URL_СТРАНИЦЫ`
-ндекс.Метрика] counter 12345679 hit https://ticketland.ru/widget?event=123 +
-[Яндекс.Метрика] Параметры{externalRef: "https://example.com", iframe: true} +
-[Яндекс.Метрика] Цель достигнута: ticket_purchase +
-</code>+
  
-===== Интеграция с электронной коммерцией =====+=== Проверка фрейма ===
  
-=== Настройка данных о покупках ===+  1. Откройте страницу с фреймом 
 +  2. В консоли напишите: `document.querySelector('iframe')` 
 +  3. Убедитесь, что фрейм загружается с ticketland.ru
  
-Для точного отслеживания ROI настройте передачу данных о заказах:+=== Проверка в интерфейсе Метрики ===
  
-<code javascript> +  - Зеленый индикатор "Данные поступают" 
-// Передача данных о заказе +  Первые данные через 2-3 часа 
-ym(12345679, 'reachGoal', 'purchase',+  Вебвизор доступен через 24 часа
-    orderPrice: 2500, +
-    orderId: 'ORD-12345', +
-    currency: 'RUB', +
-    products: [ +
-        { +
-            id: 'TICKET-001', +
-            name: 'Билет на концерт', +
-            price: 1250, +
-            quantity: 2 +
-        } +
-    ] +
-}); +
-</code>+
  
-===== FAQ по фрейму Ticketland ===== +<WRAP center round important 60%> 
- +❗ **Важно:** После изменения настроек счетчика необходимо обновить код на сайте
-=== ❓ Почему не отслеживаются посетители во фрейме? === +
-**Ответ:** Возможно, блокируются кросс-доменные запросы. Проверьте настройки CORS и используйте передачу параметров через URL. +
- +
-=== ❓ Как отслеживать источники трафика для фрейма? ===   +
-**Ответ:** Передавайте referrer и UTM-метки через параметры URL при загрузке фрейма. +
- +
-=== ❓ Нужен ли отдельный счетчик для фрейма? === +
-**Ответ:** Рекомендуется использовать отдельный счетчик для чистоты данных и избежания дублирования. +
- +
-=== ❓ Как настроить цели для этапов покупки? === +
-**Ответ:** Используйте JavaScript-события на каждом этапе воронки покупки в коде фрейма. +
- +
-<WRAP center round tip 60%> +
-🎫 **Совет:** Регулярно тестируйте отслеживание, совершая тестовые покупки через фрейм и проверяя данные в реальном времени.+
 </WRAP> </WRAP>
  
 +===== Решение частых проблем =====
  
 +=== Счетчик не собирает данные ===
 +  - Проверьте правильность номера счетчика
 +  - Убедитесь, что код на всех страницах
 +  - Отключите AdBlock для тестирования
  
 +=== Не работают цели ===
 +  - Проверьте регистр букв в идентификаторах
 +  - Убедитесь, что код цели выполняется
 +  - Проверьте с помощью консоли яндекс метрики включенной с помощью ym_debug
  
 +=== Проблемы с фреймом ===
  
 +  - Проверьте, добавлен ли домен ticketland.ru в настройки
 +  - Убедитесь, что фрейм загружается корректно
 +  - Проверьте JavaScript-ошибки в консоли
  
 +===== Полезные ссылки =====
  
 +**Официальная документация Яндекс:**
 +  - [[https://yandex.ru/support/metrica/ru/general/creating-counter|Создание счетчика]]
 +  - [[https://yandex.ru/support/metrica/ru/general/check-counter|Проверка работы счетчика]]
  
-====== Интеграции с виджетом ======+**Документация Ticketland:** 
 +  - [[https://doc.ticketland.ru/|Базовая документация]]
  
-Продавая билеты на своём сайте, зачастую возникает потребность анализировать продажи средствами web-аналитики или отправлять данные в рекламные системы для оптимизации маркетинговых активностей. В данной инструкции вы узнаете, как интегрировать виджет с аналитикой и социальными сетями. +<WRAP center round tip 60%> 
-<WRAP center round important 60%> +💡 **Совет:** Для сложных случаев интеграции обратитесь к технической документации или в поддержку сервисов
-+
 </WRAP> </WRAP>
  

tlpro/integrations.1758882603.txt.gz · Последнее изменение: 2025/09/26 13:30 — n.zalozin