Настройки страницы

Нажмите на верхней панели «Настройки» кнопку, чтобы перейти к общим настройкам страницы.

Откроется меню со следующими разделами: Общие, Мессенджеры, Раздел «Аналитика»,, Цвета, Шрифты, и Поля ввода HTML.

Общие

Информация о странице

Имя в списке

Здесь можно ввести любой текст. Это имя видно только вам в списке страниц.

URL

Это поле позволяет задать пользовательскую ссылку (URL) для страницы. Если оставить его пустым, уникальное имя будет автоматически сгенерировано из букв и цифр.

Требования:

Можно использовать только следующие символы:

• Латинские буквы (a–z)

• Цифры (0–9)

• Символ подчеркивания (_)

Имя должно быть уникальным в рамках платформы. Если оно уже занято другим пользователем, вы не сможете использовать его снова.

Вы можете подключить свой собственный домен к сайту. Если вам не удается изменить имя в ссылке, это значит, что имя уже занято. Вы можете добавить дополнительные символы или выбрать другое.

Имя вкладки браузера

По умолчанию, имя вкладки браузера совпадает с полем название сайта , но вы можете настроить его так, чтобы оно было более кратким или описательным.

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

Тег

Тег — это метка, которая отправляется вашему боту в тот момент, когда пользователь нажимает на значок мессенджера. Она позволяет мгновенно запускать определенные сценарии бота, не дожидаясь первого сообщения от пользователя.

Введите имя тега в поле «Trigger» блока-триггера.

Тег задается в настройках страницы.

Значение, указанное в поле Тег будет сохранено в переменной клиента tag . Эту переменную затем можно использовать для аналитики.

Сообщение с этим тегом запустит воронке вашего бота определенное действие, например отправку ответа или переход к следующему шагу.

Введите тег, например: welcome_offer

Сохраненный тег будет виден в панели информации о странице.

Как использовать тег мессенджера

Сначала назначьте тег, например main_flow в настройках сайта. Затем введите этот же тег в блоке-триггере вашего чат-бота.

Настройка точки входа в чат

Укажите определенный блок (например, начало вашей основной воронки) как точку входа для логики бота. Когда пользователь нажмет на значок мессенджера на вашем сайте, он попадет в мессенджер и сразу начнет с этого заранее заданного шага.

Чтобы настроить блоки формы и кнопки перенаправления в мессенджер, обратитесь к руководству "Ответы формы" в Настройки содержимого.

Когда пользователь нажимает кнопку, ему предлагается перейти напрямую в мессенджер.

• Пользователь переходит с сайта в мессенджер.

• Пользователь нажимает «Старт» или «Запустить» кнопку (в зависимости от устройства). Даже если пользователь уже ранее взаимодействовал с ботом, ему нужно нажать эту кнопку, чтобы запустить бота с сайта — это требование платформы мессенджера для ботов.

• Вместо /startбот получит тег, указанный в настройках сайта.

• Клиент получает первое сообщение из воронки, которое запускается указанным тегом.

• В профиле клиента содержится следующая переменная:

Чтобы посмотреть аналитику по тегу, перейдите в раздел раздел "Аналитика" и откройте «Клиенты» .

Далее создайте новый виджет, в котором укажите основные настройки:

• Период аналитики: например, «Прошлый месяц», «Все время» и т. д.;

• Название виджета: любое удобное название;

• Укажите тег для отслеживания.

Затем добавьте виджет.

Готово! Теперь вы можете отслеживать, как часто бот запускается с вашего сайта с помощью тега.

Встроенная аналитика MaviBot позволяет бесплатно отслеживать чаты, эффективность операторов, прогресс по курсам и показатели клиентов, без необходимости использовать сторонние инструменты.

Подробнее в «Аналитика MaviBot» статье.

Настройки изображения

Изображение предпросмотра

Это миниатюра или обложка, которая используется, когда ваш сайт делятся (например, в соцсетях или мессенджерах). По умолчанию используется первое изображение со страницы. Чтобы задать собственный предпросмотр, загрузите выбранное изображение в это поле.

Настройки защиты сайта / reCAPTCHA

Чтобы настроить reCAPTCHA, вам нужно указать пару ключей (публичный и секретный) в общих настройках вашего сайта и включить проверку reCAPTCHA в настройках формы.

Вы можете выбрать любой сервис CAPTCHA для защиты своего сайта. В этом разделе мы рассмотрим, как установить Google reCAPTCHA.

1. Получение ключей

Для начала нужно заполнить основную информацию для получения ключей: выбрать типы CAPTCHA и добавить домен сайта, на котором планируется установить защиту. Затем нажмите «Отправить».

1. Ввод ключей

Далее вы увидите пару ключей, которые нужно скопировать и вставить в настройки страницы вашего сайта в MaviBot.

1. Включение CAPTCHA в разделе «Форма»

Как создать и работать с разделом «Форма», объясняется в статье здесь.

После того как переменная Форма раздел настроен, откройте его настройки.

Нажмите «Настройки» чтобы открыть боковое меню.

Там будет виден чекбокс включения CAPTCHA.

Авторизация

Эта опция помогает отфильтровать пользователей, которые пытаются получить доступ к сайту без авторизации. Однако лучше включать ее после того, как все остальное будет настроено и вы будете уверены, что конфигурация верна. После включения единственным способом попасть на сайт будет авторизация через кнопку, отправленную ботом.

Начнем с привязки домена к Telegram-боту, подключенному к вашему проекту.

Шаг 1: Перейдите по BotFather, где вы создали своего Telegram-бота.

Шаг 2: Выберите Telegram-бота, которого хотите подключить к сайту, и нажмите на него.

Шаг 3: Перейдите в настройки Telegram-бота.

Шаг 4: В настройках бота перейдите в домен.

Шаг 5: Нажмите на «Установить домен».

Если вы уже привязали домен к боту или если вам нужно установить новый домен для того же бота, кнопка «Установить домен» будет заменена на «Сбросить домен».

Шаг 6: Отправьте домен, который хотите привязать к Telegram-боту: для этого введите домен в поле ввода сообщения и отправьте его боту.

Это может быть как ваш личный домен, полученный у регистратора доменных имен, так и что-то вроде mavitbot.ai

На этом этапе привязка домена завершена.

После привязки домена к боту включите чекбокс «Требовать авторизацию через Telegram» в настройках формы:

Настройки интерфейса и доступа

Доступ только по спискам

Эта опция позволяет предоставлять доступ к сайту на основе присутствия пользователя в определенных списках вашего проекта.

Как скрыть надпись «Сделано с MaviBot»

Чтобы скрыть надпись, просто отметьте этот чекбокс, если это необходимо.

Вы можете убрать надпись «Сделано с MaviBot» на любом платном тарифе. Мы ценим всех, кто оставляет надпись «Сделано с MaviBot» на своих страницах.

HTML/CSS/JS

При необходимости вы можете заполнить этот раздел. Если вы знакомы с CSS, вы можете сделать ваш сайт еще более привлекательным визуально. Также здесь можно вставить код аналитики, Facebook Pixel и многое другое.

ОБРАТИТЕ ВНИМАНИЕ! При копировании примеров скриптов убедитесь, что если тег открыт, его также нужно закрыть. Например: <script> ... </script>, <style> ... </style>

Как изменить ссылку на Политику конфиденциальности

В блоке формы заявки с кнопками мессенджеров можно отображать чекбокс Политики конфиденциальности. По умолчанию он ведет на политику конфиденциальности конструктора.

Вы можете изменить ссылку на свою страницу Политики конфиденциальности с помощью скрипта.

Добавьте скрипт в поле «HTML code (body)» в разделе CSS и JS.

<script>
document.getElementsByClassName('salebot-privacy__link')[0].href = "ссылка на политику конфиденциальности";
</script>

Как отключить индексирование страницы

Чтобы отключить индексирование страницы, добавьте скрипт в поле HTML code (head).

<meta name="robots" content="noindex, nofollow">

Как удалить кнопку Facebook со страницы вашего сайта

Добавьте скрипт в поле «HTML code (body)» в разделе CSS и JS.

<script>
document.getElementsByClassName('vk_link')[0].remove()
</script>

Как удалить заголовок страницы вашего сайта

Добавьте скрипт в поле «HTML code (body)» в разделе CSS и JS. Это относится к более старым версиям мини-лендингов.

<script>
document.getElementsByClassName('title_container')[0].remove()
</script>

Как изменить ссылку кнопки Telegram.

Добавьте скрипт в поле «HTML code (body)» в разделе CSS и JS.

<script>
window.onload = function() {
    let button = document.querySelector('.tg_link')
    if (button) {
        button.setAttribute('data-url', 'требуемое значение')
        button.removeAttribute('onclick')
        let newUrl = button.getAttribute('data-url')
        button.addEventListener('click', () => {
            window.location.href = newUrl
        })
    }
}
</script>

Для других мессенджеров замените tg_link на insta_link, fb_link, и т. д.

Как изменить текст кнопки

Вставьте этот код в поле «HTML code (body)» в разделе CSS и JS.

1. Чтобы отобразить кнопку мессенджера, создайте блок формы заявки с вопросами и укажите, для каких мессенджеров должны отображаться кнопки

Установите отображение кнопки в стиль «Иконка с текстом»

Подробнее о разделе Form объясняется здесь. ссылка

1. В разделе Site Settings, на вкладке CSS and JS, вставьте следующий код в поле «HTML settings» → «HTML code (body)»:

<style>
.tg_link {
font-size: 0 !important;
padding: 15px 15px !important;
}
.viber_link {
font-size: 0 !important;
padding: 15px 15px !important;
}

.tg_link:after {content: "Зарегистрироваться в Telegram";font-size: 15px;color: white}
.viber_link:after {content: "Зарегистрироваться в Viber";font-size: 15px;color: white}
</style>

Этот код изменит текст кнопок для Telegram и Viber. Для других мессенджеров добавьте аналогичный код по примеру.

Как выровнять кнопки в ряд

Вставьте следующий скрипт в поле «JS code» в основных настройках вашего мини-лендинга.

$(function() {
$('.link_group').css("flexWrap", 'noWrap')
})

Как изменить favicon

Добавьте скрипт в поле «HTML code (head)» в разделе CSS и JS.

Этот код можно использовать для изменения favicon — значка сайта или веб-страницы.

<link rel="shortcut icon" type="image/x-icon" href="ссылка на иконку" />

Как передать все переменные/параметры URL при открытии вашего сайта

Вам нужно разместить скрипт на всех страницах ВАШЕГО сайта, которые содержат прокси-ссылку. Скрипт нужно добавить сразу после <body> тега.

Если вы используете свой собственный домен для прокси-ссылок, вам следует заменить sbsite.pro на ваш домен.

Если на вашем сайте есть прокси-ссылки на мессенджеры со страницы сайта, вы можете добавить этот скрипт — он передаст боту все переменные, использованные для открытия сайта.

<script>
var links = document.getElementsByTagName("a")
for (let i of links) {
    if (i.href.startsWith("https://mavibot.site/")) {
        if (i.href.split("?").length > 1) {
            i.href += "&" + location.search.split("?")[1]
        } else {
            i.href += location.search
        }
    }
}</script>

Как передать аналитику cookies боту

Скрипт необходимо разместить на всех страницах ВАШЕГО сайта, которые содержат прокси-ссылку. Его следует добавить сразу после <body> тега.

Если вы используете свой собственный домен для прокси-ссылок, вам нужно заменить mavibot.ai на ваш домен.

Если вам нужно передать cookies аналитики боту, добавьте на свой сайт следующий скрипт:

<script>
setTimeout(function() {
    var links = document.getElementsByTagName("a");
    var cookies = ['_fbc', '_fbp', '_ga', '_ym_uid', 'roistat_visit'];
    var cookies_string = '';

    cookies.forEach(function(cookie_name){
        let cookie_val = get_cookie(cookie_name);
        if (cookie_val !== undefined) {
            cookies_string += (cookies_string != '' ? "&" : '') + cookie_name + "='" + cookie_val + "'";
        }
    });

    for (let i of links) {
        if (i.href.startsWith("https://salebot.site/")) {
            if (i.href.split("?").length > 1) {
                i.href += "&" + cookies_string;
            } else {
                i.href += "?" + cookies_string;
            }
        }
    }

    function get_cookie(name) {
        let matches = document.cookie.match(new RegExp("(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)"));
        return matches ? decodeURIComponent(matches[1]) : undefined;
    }
}, 3000);
</script>

Как изменить ссылку на политику конфиденциальности

На вкладке CSS and JS вставьте следующий код в поле «HTML Settings» → «HTML code (body)»:

Этот скрипт позволяет заменить ссылку на Политику конфиденциальности на свою.

<script>
document.getElementsByClassName('salebot-privacy__link')[0].href = "ссылка на политику";
</script>

Мессенджеры

Начальное сообщение WhatsApp

Текст, который вы введете здесь, автоматически появится в WhatsApp у пользователя как черновик, когда он нажмет на ссылку с вашего сайта.

Ему останется только нажать «Отправить» в мессенджере.

1. Создайте «Start» блок в конструкторе.

2. Введите в него текст вашего начального сообщения.

Аналитика

Включите «Сохранять данные аналитики для конверсии» настройку, чтобы сохранить отслеживание конверсий вашего сайта.

Это позволит вам отслеживать конверсии в Раздел «Аналитика», .

Экспорт сайта / Импорт страницы

Конструктор сайта позволяет экспортировать и импортировать целые страницы. Это полезно для переноса сайта между проектами без его пересборки, при этом весь контент сохраняется.

Как экспортировать/импортировать страницу:

1. Сначала убедитесь, что все изменения сохранены, нажав "Сохранить" .

Нажмите «Экспортировать страницу» в редакторе, чтобы экспортировать вашу страницу.

После того как файл будет загружен (вы увидите его в папке загрузок и получите подтверждение), перейдите в настройки сайта в целевом проекте. Там нажмите «Создать» чтобы создать идентичную страницу.

Выберите ранее сохраненный файл экспортированной страницы. После подтверждения загрузки уведомлением вы сразу попадете в редактор, чтобы начать работу с импортированной страницей.

При необходимости внесите нужные изменения и нажмите кнопку «Сохранить».

Где найти ID страницы?

ID страницы сайта из списка сайтов можно передавать в функции бота — например, чтобы отправить ссылку на ваш сайт через бота или открыть его как мини-приложение в Telegram.

Подробнее о Telegram WebApp читайте в этой статье.

Номер сайта назначается автоматически с помощью # символа.

ID страницы можно найти, наведя курсор на нужную страницу сайта.