# Віджет лідогенерації

Віджет генератора лідів допоможе вам цілодобово збирати запити користувачів із вашого сайту. Давайте подивимося, як можна встановити та налаштувати віджет.

## Налаштування

<div data-with-frame="true"><figure><img src="/files/fa4c94d61a3d91c82cce4052c0c21f168504d564" alt="" width="346"><figcaption></figcaption></figure></div>

У налаштуваннях віджета, у розділі "Основна інформація", вам потрібно заповнити такі обов’язкові поля:

1. **Назва віджета;**
2. **Домен сайту, на якому ви розміщуєте віджет:** це може бути як сайт, створений на Mavibot, або на сервісі Tilda, так і ваш власний.

Далі є прапорці, які допоможуть надсилати зворотні виклики в систему після того, як клієнт надішле запит, а також відображати логотип.

Такі поля налаштувань допоможуть вам визначити, яку саме інформацію потрібно запитати у клієнта:

<div data-with-frame="true"><figure><img src="/files/f8a923c847bc38165b3f9d53aba8f726c08a71c6" alt=""><figcaption></figcaption></figure></div>

За потреби форма для надсилання клієнтам не буде відправлена на ваш сайт, доки клієнт не заповнить обов’язкове поле.

## Умови спрацьовування

<div data-with-frame="true"><figure><img src="/files/41a19e6892e284a12cdfd40f6fe76c4fa2a1d502" alt=""><figcaption></figcaption></figure></div>

### Часовий інтервал

Ви можете налаштувати час відображення віджета на сайті. Для цього скористайтеся функцією "Коли показувати віджет":

1. **Миттєво**\
   Це налаштування показуватиме віджет, коли користувач відвідає сайт.
2. **Після затримки за часом**

<div data-with-frame="true"><figure><img src="/files/0b705ff2aab1d6bd6d2ed250d4bbd830db82cd00" alt=""><figcaption></figcaption></figure></div>

Віджет буде показано на сайті через певну кількість секунд після того, як клієнт відвідає сайт.

Часовий інтервал задається в секундах, де мінімальне значення — 1 секунда, а максимальне — 15 секунд.

3. **Після прокручування**

<div data-with-frame="true"><figure><img src="/files/dffaef3252088f3070b1dff7d8e3388f43d63ebb" alt=""><figcaption></figcaption></figure></div>

Умова "Після прокручування" означає, що щойно користувач виконає дію прокручування сайту, незалежно від того, чи прокрутить він увесь сайт до кінця, чи перегляне невелику частину, віджет буде показано на сайті через задану кількість секунд.

Мінімальне значення часового інтервалу — 1 секунда; максимальне — 15.

## Візуальний вигляд

<div data-with-frame="true"><figure><img src="/files/5e70cd0ddbc776b452d748a85d8016dbbc91311a" alt=""><figcaption></figcaption></figure></div>

Скористайтеся функцією завантаження зображення в налаштуваннях зовнішнього вигляду, щоб додати обкладинку.\
Рекомендуємо обрати яскравий і цікавий дизайн, щоб привернути якомога більше уваги користувачів.

<div data-with-frame="true"><figure><img src="/files/bcbf8df590155587ef0c9edd9aa8f7e2bab00f0b" alt=""><figcaption></figcaption></figure></div>

Далі розташуйте зображення, вирівнявши його відносно верхнього, лівого та правого країв:

<div data-with-frame="true"><figure><img src="/files/d04c39fd309afa55be92c3b03d910eb7cd6341d9" alt=""><figcaption></figcaption></figure></div>

Потім задаються порожні поля: вони знадобляться вам, якщо ви хочете вказати заголовок і підзаголовок віджета:

<div data-with-frame="true"><figure><img src="/files/bac46fe9afc17cbc3db7f46ca8a71970578c160e" alt=""><figcaption></figcaption></figure></div>

Потім напишіть мотиваційний текст, щоб зацікавити користувача вашою пропозицією:

<div><figure><img src="/files/a533efad5c70546e17521adaff92bd3bc6d23696" alt=""><figcaption></figcaption></figure> <figure><img src="/files/9ab0d7ee0681c94fe8b2a3557ad98e6a8b0c1e80" alt=""><figcaption></figcaption></figure></div>

#### **Графічне налаштування**

У налаштуваннях зовнішнього вигляду ви можете застосувати свої навички графічного дизайну, щоб створити абсолютно унікальний віджет.

<div data-with-frame="true"><figure><img src="/files/c203803265c093f0a256d581f7ebdd014118cc85" alt=""><figcaption></figcaption></figure></div>

Вам доступна широка палітра кольорів.

Також рекомендуємо експериментувати з унікальними візерунками для фону віджета, щоб підвищити його візуальну привабливість.

## **Як додати свій віджет на сайт**

Після того як ви налаштували всі параметри та відредагували зовнішній вигляд віджета відповідно до його унікального дизайну, натисніть кнопку "Додати віджет" внизу екрана:

<div data-with-frame="true"><figure><img src="/files/e730a74779629d11b83315f574a3b74a86e4b2f2" alt=""><figcaption></figcaption></figure></div>

Після цього ви перейдете до списку готових віджетів, де потрібно натиснути кнопку "Вбудувати код на сайт":

<div data-with-frame="true"><figure><img src="/files/0f4655245009e3afa59c44e2f72efbbc959f44b7" alt=""><figcaption></figcaption></figure></div>

Після цього ви побачите модальне вікно зі скриптом:

<div data-with-frame="true"><figure><img src="/files/48ce0a7c831b81a26a2b6ec6000e2b5e33238281" alt=""><figcaption></figcaption></figure></div>

Далі скопіюйте скрипт і перейдіть до налаштувань сайту (домен, указаний у вашій конфігурації віджета). Вставте скрипт в HTML `<head>` розділ.

{% hint style="info" %}
**Щоб вбудувати віджет на сайт Tilda:**

1. Скопіюйте скрипт віджета, натиснувши **"Вбудувати код на сайт"** кнопку.
2. У редакторі Tilda вставте скрипт у налаштування проєкту або в HTML-блок на відповідній сторінці.
   {% endhint %}

**Чудово!** Налаштування та встановлення вашого віджета завершено.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.mavibot.ai/doc/uk/websites/widgets/leads.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
