# Мини-лендинги | Подписные страницы

Мини-лендинг выглядит так :point\_down: И его задача - привести человека в чат-бота. 

<div align="left"><figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FVc4MiMURML5KpxPgaSDd%2Fimage.png?alt=media&#x26;token=3ee7b7a0-8d95-497b-9347-76dc7dc3ae8b" alt=""><figcaption></figcaption></figure></div>

**На мини-лендинге вы можете:**

* показать информацию о своем товаре, услуге или продукте,&#x20;
* запросить какую-либо информацию у посетителя с помощью формы обратной связи,
* пригласить пользователя подписаться на бота в удобном для него мессенджере.&#x20;

После нажатия на кнопку мессенджера будет запущен указанный в настройках бот. \
\
Также, после нажатия на кнопку сохраняется вся информация о пользователе:&#x20;

* имя и фамилия, указанные в мессенджере,&#x20;
* данные из формы обратной связи, которые заполнил пользователь на мини-лендинге,
* все параметры из ссылки, по которой перешёл пользователь.

А ещё мини-лендинг позволяет:&#x20;

**✔** Указать ссылки на один, или несколько мессенджеров, которые вы используете\
\&#xNAN;**✔** Встраивать его на свои сайты и лендинги \
\&#xNAN;**✔** Размещать ссылку на него в оффлайне с помощью QR-кодов.\
\&#xNAN;**✔** Генерировать прямые ссылки на выбранный мессенджер, передавая в бота любые необходимые вам параметры\
\&#xNAN;**✔** Собирать информацию о пользователе, перед запуском бота\
\&#xNAN;**✔** Размещать счетчики аналитических систем и пиксели ретаргетинга (Yandex.Metrika, Google Analytics, Roistat, Facebook, VK, MyTarget, и любые другие)\
\&#xNAN;**✔** Размещать любые сторонние пиксели и скрипты\
\&#xNAN;**✔** Модифицировать текст и структуру мини-лендинга с помощью HTML-разметки.\
\
**А самое главное** - не нужно обладать какими-то специальными знаниями для того, чтобы настроить всё указанное. \
Всё, что может потребоваться - будет в этой статье :) \
\
Приступим к созданию мини-лендинга :relaxed::point\_down:

## Как создать мини-лендинг?

Авторизуемся на сайте [https://leadconverter.ru](https://leadconverter.ru/?utm_source=docs)

В главном или боковом меню находим раздел "Мини-лендинги".

![](https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FBUlqF3be1vw84tPcGCw2%2Fimage.png?alt=media\&token=4218d714-76fd-4a85-8c61-0015aec3a9d9)

На странице раздела "Мини-лендинги" мы увидим такой интерфейс:

![](https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FNvM3EU08J9PJlOT8AoIl%2Fimage.png?alt=media\&token=07a92a2c-5f09-423b-b836-82f7ddce4cba)

Для добавления мини-лендинга жмём на <mark style="color:blue;">синюю</mark> <mark style="color:blue;">кнопку</mark> "создать мини-лендинг", или <mark style="color:red;">красную</mark> <mark style="color:red;">кнопку</mark> с плюсом внизу экрана. \
\
После клика мы попадаем на страницу создания мини-лендинга.

### Содержимое

Содержимое - самый первый этап настройки мини-лендинга.

Здесь мы можем изменять настройки контентной части мини-лендинга:\
Указать картинку, текстовое описание, выбрать мессенджеры, и многое другое. \
Рассмотрим подробнее:

#### Название мини-лендинга

<figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FdcNvyk6074wGaHirxMau%2Fimage.png?alt=media&#x26;token=c4469db5-461d-4363-b705-4467e58e0be3" alt=""><figcaption></figcaption></figure>

Название мини-лендинга будет отображаться только в личном кабинете **LeadConverter**. \
Здесь можно указать любое имя. Это поле служит для удобной навигации среди своих мини-лендингов.&#x20;

#### Выберите бота&#x20;

Перед тем как вы продолжите заполнение этого шага - у вас уже должен быть [создан бот в LeadConverter](https://docs.leadconverter.su/bots/sozdayom-bota), а так же [подключен мессенджер](https://docs.leadconverter.su/podklyuchenie-messendzherov), в который вы хотите приглашать клиента. \
\
В этом поле мы выбираем, какой бот будет запущен после того как пользователь кликнет на кнопку мессенджера.

{% hint style="success" %}
**Можно не делить ботов по мессенджерам, и сделать один для всех.**&#x20;

Режим синхронизации в блоке "**Сообщение**" позволяет создавать бота для всех мессенджеров сразу.&#x20;
{% endhint %}

{% hint style="danger" %}
&#x20;При создании мини-лендинга **ОБЯЗАТЕЛЬНО нужно выбрать бота**. Иначе мини-лендинг не сохранится
{% endhint %}

#### Подключите каналы

Здесь нужно выбрать каналы (мессенджеры), которые будут **отображаться на мини-лендинге**.

При клике на соответствующую кнопку подписчик попадет в выбранный канал.

<figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FncF6LnHOozMGFPCBB1oF%2Fimage.png?alt=media&#x26;token=725b1d7c-fcf9-44ca-8c8b-5c79ac6f682c" alt=""><figcaption></figcaption></figure>

Чтобы подключить каналы к LeadConverter можно изучить инструкцию ниже 👇

{% content-ref url="podklyuchenie-messendzherov" %}
[podklyuchenie-messendzherov](https://docs.leadconverter.su/podklyuchenie-messendzherov)
{% endcontent-ref %}

**Каждый мессенджер по-своему реагирует на запуск бота:**

> В **Telegram** сначала нужно будет подтвердить переход в приложение Telegram, и далее нажать кнопку "**Запустить**", после которой активируется назначенный бот.

> На момент записи данного урока **Instagram** не умеет работать с переходом в личные сообщения, и, тем более, не умеет работать с запуском бота после перехода из мини-лендинга. Всё, что произойдёт - открытие профиля, который был выбран.

> **ВКонтакте** переведет пользователя в приложение, в котором будет отображаться фотография, взятая из мини-лендинга, и кнопка подписки, которая получает разрешение на отправку личных сообщений человеку от имени указанной группы.&#x20;

{% hint style="warning" %}
Для корректной работы **ВКонтакте**, нужно подключить приложение к своей группе.
{% endhint %}

> **Viber** в desktop версии запросит разрешение открыть приложение Viber, после одобрения сразу сработает назначенный бот. \
> В мобильной версии - будет открыто приложение, бот так же будет запущен сразу, после перехода по ссылке.

> Поведение Email зависит от того, указана ли ссылка "переадресации после подписки". \
> В случае если ссылка не указана - будет показано всплывающее окно с текстом благодарности за подписку.\
> Если ссылка для переадресации указана - пользователь будет перенаправлен на указанный адрес.

> При использовании **Facebook** потребуется нажать на кнопку "**Начать**", если пользователь не был подписан на бота, затем активируется назначенный бот.\
> В случае, если пользователь был подписан ранее - действий не потребуется.

#### Содержимое лендинга

Мы заполнили основные настройки, необходимые для корректной работы мини-лендинга. Теперь наполним его содержимым :)&#x20;

#### Загрузить изображение

Здесь мы можем выбрать **изображение** для мини-лендинга, чтобы сделать наш мини-лендинг более красочным и запоминающимся.

<figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FM2g7DIldNtv9rzhaZdiJ%2Fimage.png?alt=media&#x26;token=8d7a7edd-0c85-4f82-8ef8-284172758e5c" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Рекомендуемый размер изображения **795x250 пикселей.**\
**Если вы хотите, чтобы ваш мини-лендинг загружался быстрее - рекомендуем предварительно сжать изображение с помощью** [**squoosh.app**](https://squoosh.app)
{% endhint %}

Если нужно удалить текущую картинку или заменить её - нужно навести мышку на картинку и нажать соответствующие кнопки:

<figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FjKkrc0HRX2Fefyeeew0I%2Fimage.png?alt=media&#x26;token=d2200641-ad28-4a2c-83d5-8cb96d98a799" alt=""><figcaption></figcaption></figure>

#### Использовать HTML-разметку в тексте

Эта опция будет полезна тем, кто умеет работать с **HTML.**

Здесь можно оформить текст через HTML, вставить дополнительные изображения... И в принципе использовать всё, что умеет HTML :)

<figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FmV1wNFs1pC5HhjT67Yra%2Fimage.png?alt=media&#x26;token=a9b47d1f-2cac-4f55-84aa-1993d5e8a5e7" alt=""><figcaption></figcaption></figure>

Например:

```
<b>Подробное</b>, <i>красочное</i> описание мини-лендинга, для того, чтобы вызвать желание пользователя выбрать удобный мессенджер и запустить бота <br><br>

Красота :)
```

Получается оформленный текст :)

<div align="left"><figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FwS7RDzGPMqS3aPJbOXuG%2Fimage.png?alt=media&#x26;token=b4b3ea2e-e865-482c-a914-2f4f626587a8" alt=""><figcaption></figcaption></figure></div>

#### Описание

Здесь мы размещаем текст, в котором описываем нашего бота.&#x20;

Главная его задача - вызывать у пользователя желание запустить бота.

Если вы активировали опцию "Использовать HTML-разметку в тексте" - в текст описания необходимо размещать html-код.&#x20;

<figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FpoK9LTAXafnZdkg76WpN%2Fimage.png?alt=media&#x26;token=3acdea74-0020-409d-b28b-b1db86310048" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Максимальная длина текста: **30 000 символов**
{% endhint %}

#### **Призыв к действию**

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

<figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FQ8WBkPgk88UKtiIYpeY5%2Fimage.png?alt=media&#x26;token=299c02a6-ec75-497d-9bcf-668af36bde8d" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Максимальная длина призыва: **500 символов**
{% endhint %}

#### Текст кнопки подписки (Для приложения ВКонтакте)

Текст кнопки, которая будет отображаться на странице **приложения ВКонтакте**

{% hint style="success" %}
Максимальная длина текста кнопки: **60 символов**
{% endhint %}

<figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FGtnUVyaZ3GsWe1Y6bq6Y%2Fimage.png?alt=media&#x26;token=2d322df2-2033-45dc-b82b-764bd1153183" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FthYDqgN26ivh1A6jXgcl%2Fimage.png?alt=media&#x26;token=44d64940-0fa7-4655-bbce-97edf5b81acc" alt=""><figcaption></figcaption></figure>

#### Стиль кнопок

На данный момент доступны три варианта отображения кнопок. Выбор каждого затрагивает только внешний вид отображения кнопок.\
\
Рассмотрим все три:

1. **По умолчанию**

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

<div align="left"><figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FlV0FcJIlcs8M2eGrEybK%2Fimage.png?alt=media&#x26;token=563606a6-5222-4e63-8f6c-27b8e6b5d858" alt=""><figcaption></figcaption></figure></div>

**2.** **2 кнопки в ряду**

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

<div align="left"><figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2Fquoqgy9v9o2Nwb1LiqTF%2Fimage.png?alt=media&#x26;token=b263287f-0b67-466a-8939-e13a2fd99b61" alt=""><figcaption></figcaption></figure></div>

**3. 3 кнопки в ряду**

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

<div align="left"><figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FeZKzYqXR0hNgZrSFnR9j%2Fimage.png?alt=media&#x26;token=2a896c1b-5830-45a2-965a-ff8b655d9253" alt=""><figcaption></figcaption></figure></div>

{% hint style="success" %}
При необходимости можно включить отображение **названия мессенджеров** на кнопках&#x20;
{% endhint %}

#### Цвет текста, фона и заднего фона

Здесь мы можем выставить нужные цвета для мини-лендинга.

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

<figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FQWHtAD4HAFWoKFSQgEM2%2Fimage.png?alt=media&#x26;token=eda6a1fc-61b7-4154-95e7-c645b9ffaa77" alt=""><figcaption></figcaption></figure>

#### Принять все политики

Речь идёт о политике конфиденциальности, которая, **по законодательству**, должна быть на всех формах обратной связи. Т.к. человек должен знать, как будет использована информация, которую он туда введёт.

<figure><img src="https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FgSEfIqq6YhponNTvr2f7%2Fimage.png?alt=media&#x26;token=7bacb0b3-e008-4373-8f63-8bdaac4a8fd7" alt=""><figcaption></figcaption></figure>

В **LeadConverter** по умолчанию есть политика для форм обратной связи. Но!

{% hint style="success" %}
Можно загрузить собственную политику конфиденциальности в личном кабинете.&#x20;
{% endhint %}

Для редактирования политики, нужно в **личном кабинете LeadConverter** перейти в:&#x20;

<mark style="color:green;">**Настройки -> Вкладка "Реквизиты" -> Редактировать политику конфиденциальности.**</mark>&#x20;

Там будет панелька с инструментами редактирования, и текстом текущей политики.

![](https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2F08OuwCo8blOcj3MAht9D%2Fimage.png?alt=media\&token=ee04f7d5-5f73-497c-8fdd-61a2c3d7f165)

#### Выводить реквизиты компании

В **LeadConverter** можно добавить на мини-лендинг любую информацию о себе и своей компании.&#x20;

Информация будет отображаться в самом низу мини-лендинга.&#x20;

![](https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FAC0xvThvZgqaQEjd1wlj%2Fimage.png?alt=media\&token=1328655c-35d6-4538-98de-295b22a710cf)

**Где можно добавить реквизиты компании?**&#x20;

<mark style="color:green;">**Настройки -> Вкладка "Реквизиты" -> Редактировать реквизиты компании.**</mark>

{% hint style="info" %}
Если на мини-лендинге нужно сделать *<mark style="color:blue;">**к**</mark><mark style="color:purple;">**р**</mark><mark style="color:orange;">**а**</mark><mark style="color:red;">**с**</mark><mark style="color:yellow;">**и**</mark><mark style="color:green;">**в**</mark><mark style="color:blue;">**е**</mark><mark style="color:purple;">**н**</mark><mark style="color:orange;">**ь**</mark><mark style="color:red;">**к**</mark><mark style="color:green;">**о**</mark>*, но нет знаний языка разметки - можно написать нам в [поддержку](https://docs.leadconverter.su/kak-zadat-vopros-v-podderzhku), мы быстро с этим поможем :)&#x20;
{% endhint %}

### Настройки Email канала

В этом разделе указываются действия, которые будут выполнены после того, как пользователь будет подписан на Email-канал. <br>

Доступны два режима поведения:

1. Пользователь будет перенаправлен на указанную страницу.
2. Пользователю будет показано всплывающее окошко с текстом благодарности за подписку.&#x20;

Если поле "Переадресация на страницу после email-подписки" не заполнено - будет отображено сообщение с благодарностью.

Заголовок и текст уведомления можно изменить в соответствующих полях:

![](https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FkYE6tbZZk6uwbHKGVUmV%2Fimage.png?alt=media\&token=2a18c6a9-d009-48b0-af31-73e5429b123a)![](https://1545507669-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYOiJSIpC8f-Cm8cOEc%2Fuploads%2FknpmNL1FcOfI2V4G1o65%2Fimage.png?alt=media\&token=50aee68d-aaf4-4c9a-8ae6-6c49bcce6047)

Если поле "Переадресация на страницу после email-подписки" заполнено - пользователь будет перенаправлен на указанную страницу.

### Подводим итоги

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

{% content-ref url="mini-lendingi-or-podpisnye-stranicy/nastroika-formy-mini-lendinga" %}
[nastroika-formy-mini-lendinga](https://docs.leadconverter.su/mini-lendingi-or-podpisnye-stranicy/nastroika-formy-mini-lendinga)
{% endcontent-ref %}