Как подключить BotHelp
BotHelp поддерживает ограниченную интеграцию с Откуда Подписки, доступен функционал:
- Передача активаций бота в рекламные системы Яндекс/ФБ/Гугл/ВК, оптимизация на старты бота
- Аналитическая отчетность по аудитории: источники трафика, полный список подписчиков, utm метки откуда пришли (только подписки)
- Аналитическая отчетность по подпискам: переходы в бота, конверсии в подписку
- Ежедневные отчеты бота
“подписки 24ч” - Досье подписчика
Следуйте по шагам для настройки подключения:
1. Настройка webhook для BotHelp
- Для интеграции необходимо получить API ключ. Как получить API ключ тут.
- В самом боте после пункта старт, создайте действие.
- Выберите там пункт “Отправить данные подписчика через Webhook” на url
Пример url, на который надо послать запрос: : https://bot-api.tgtrack.ru/v1/API_КЛЮЧ/my_bothelp_was_started |
Просто выберите пункт о пересылке данных пользователя и отошлите его на наш url методом POST.
2. Проверка подключения
Для проверки настройки webhook используйте страницу тестирования API TGTrack:
https://bot-api.tgtrack.ru/last_events/
Укажите ваш API ключ (который получили на шаге 1) и проверьте последние 100 запросов.
Проверим, что BotHelp действительно передаёт старт, стоп, а сервис Откуда Подписки принимает его без ошибок. Статус обработки событий должен быть – 0.
Особенности:
Если у вас несколько воронок, которые запускаются по разным значениям параметра start бота, то в ссылке на вашего бота укажите нужный параметр:
https://t.me/?start=&nochange=1
nochange – запрещает нашему сервису изменять значение параметра старт.
Если посадочная страница сделана на конструкторе BotHelp
Если ваш лендинг сделан на конструкторе BotHelp, то кнопку перехода в телеграм канал нужно сделать самому на чистом HTML коде:
<!-- Start BotHelp custom button -->
<div class="btnWrapper" id="bothelp_button">
<a href="https://t.me/ссылка_в_канал/номер_поста" target="_blank">
<button class="toTg">
Перейти в телеграм
</button>
</a>
</div>
<style>
.btnWrapper a{
text-decoration: none;
padding-left: 30px;
padding-right: 30px;
display: block;
margin-top: 16px
}
.toTg {
display: block;
box-sizing: border-box;
width: 100%;
padding: 16px 24px; /* Отступы */
font-family: 'Nunito', sans-serif;
background-color: #4faee6; /* Основной цвет фона */
color: white; /* Цвет текста */
border-radius: 4px; /* Скругленные углы */
text-align: center; /* Центровка текста */
font-size: 16px; /* Размер шрифта */
font-weight: normal; /* Толщина шрифта */
cursor: pointer; /* Курсор при наведении */
border: none; /* Убираем границу */
position: relative; /* Положение для блика */
overflow: hidden; /* Скрываем выходящий блик */
}
.toTg::before {
content: '';
position: absolute;
top: -30%;
left: -30%;
width: 50%;
height: 50%;
background: rgba(255, 255, 255, 0.5);
transform: rotate(45deg);
pointer-events: none;
animation: shine 2s linear infinite; /* Цикличная анимация блика */
}
@keyframes shine {
0% {
left: -150%; /* Начинаем с левой стороны */
}
100% {
left: 150%; /* Заканчиваем на правой стороне */
}
}
</style>
<script>
var fOnLoad = () => {
let bhButton = document.querySelector(".wh-landing-button-telegram");
bhButton.innerHTML = "";
bhButton.appendChild(document.getElementById("bothelp_button"));
};
window.addEventListener("DOMContentLoaded", fOnLoad);
</script>
<!-- End BotHelp custom button -->
Code language: HTML, XML (xml)
См. далее:
Передача стартов бота в Я.Директ
Передача стартов бота в Facebook/Insta
Передача стартов бота в VK Реклама