# Розділ кнопок

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

{% hint style="success" %}
До кнопок із можливістю налаштування (custom) можна додати політику конфіденційності та оферту.

Для цього просто встановіть відповідні прапорці та прикріпіть посилання.
{% endhint %}

<figure><img src="/files/358007cfb9205fedb8a7cc2993c0b9f22bda4b9d" alt=""><figcaption></figcaption></figure>

## Як створити кнопку

У режимі редагування сайту натисніть «+», після чого відкриється бічне меню для додавання розділів.:

<figure><img src="/files/e3f33b3c9c63c085c1a9d3016c6c1fbeb582c20d" alt=""><figcaption></figcaption></figure>

Під час натискання на розділ кнопок буде додано стандартний шаблон із двома кнопками, у налаштуваннях якого ви можете редагувати, додавати або видаляти кнопки, додати посилання на політику конфіденційності та (або) оферту:

<figure><img src="/files/9b00051a0859ceec3161388ddc45ec4be0570514" alt=""><figcaption></figcaption></figure>

Щоб відкрити внутрішні налаштування кнопки, натисніть на саму кнопку:

<figure><img src="/files/e435b896be5e4bcddd23f272ea195a2cd0479b15" alt=""><figcaption></figcaption></figure>

Далі відкривається модальне вікно з налаштуваннями кнопки:

<figure><img src="/files/c604c5efa198c9712ba1120ff7eb3b3a77fe310a" alt=""><figcaption></figcaption></figure>

У вікні створення кнопки ви можете вибрати її функцію:

<figure><img src="/files/8cdd23833f12eebf18713f384828bc4062fefb67" alt=""><figcaption></figcaption></figure>

Нижче ми опишемо функції кожної кнопки.

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

<figure><img src="/files/f1a3d2a87b3a037092fb1b5a53dcd42ccbd2976d" alt=""><figcaption></figcaption></figure>

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

### Як додати кнопки

Щоб додати кнопки, розташовані на одній лінії, натисніть на «+» праворуч від кнопки:

<figure><img src="/files/bd36b2326398a9a69e9e8dd9449414f0013ae53b" alt=""><figcaption></figcaption></figure>

Якщо вам потрібно додати кнопку під попередньо доданою кнопкою, натисніть «+ Додати кнопку»:

<figure><img src="/files/f53168f37c49f886b06d24d414c0d74fd5fb76bf" alt=""><figcaption></figcaption></figure>

### Кнопка з функцією оплати

Щоб створювати платіжні кнопки на сайті, спочатку потрібно підключити платіжні системи до платформи в проєкті.

{% hint style="info" %}
Читати, як підключити платіжну систему до проєкту [тут. ](/doc/uk/integrations/payment.md)
{% endhint %}

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

<figure><img src="/files/9c066550d14071b7424b1fc025d3fdc8bbbf7988" alt=""><figcaption></figcaption></figure>

За допомогою цієї кнопки можна додати функцію оплати на сайт через платіжну систему, зручну для вас. Далі вкажіть суму товару, його назву та посилання для перенаправлення після успішної оплати.

{% hint style="info" %}
Увага!

У випадаючому меню рядка платіжних систем будуть доступні лише ті інтеграції, які ви увімкнули в розділі проєкту «Платіжні системи».
{% endhint %}

#### Кнопка функції телефону

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

Натискання на кнопку на мобільних пристроях відкриває вікно для вибору застосунку:

<figure><img src="/files/50d8e43fdbcda32bdf30df962518fee61ac42921" alt=""><figcaption></figcaption></figure>

### Кнопка функції пошти

Створіть нову кнопку з функцією Пошта та вкажіть у налаштуваннях адресу електронної пошти:

<figure><img src="/files/92d2dd760ca0379ccba31cdb5ccb10fcfbbcb411" alt=""><figcaption></figcaption></figure>

Під час натискання на кнопку автоматично відкриються застосунки для надсилання електронних листів, а пошта з налаштувань кнопки автоматично буде вставлена в поле «Отримувач».

### Кнопка функції посилання

{% hint style="danger" %}
Щоб передати дані та запустити бот, використовуйте розділ «Форма заявки з кнопками месенджерів»!
{% endhint %}

Створіть нову кнопку та виберіть функцію Посилання. Натискання на кнопку відкриває сторінку, вказану в налаштуваннях кнопки.

<figure><img src="/files/22a4f0257e5cf2b5d9cc966b32f4b8c28c3698cb" alt=""><figcaption></figcaption></figure>

### Функція кнопки плану курсу за тарифом

Також ви можете додати платіжні збори для налаштованих онлайн-курсів у MaviBot у функціях кнопки:

<figure><img src="/files/3a647519d868424830c61f806cc6e2c586c7ed74" alt=""><figcaption></figcaption></figure>

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

{% hint style="info" %}
Усі налаштування оплати, платіжної системи та вартості тарифного плану курсу здійснюються в розділі «Курси».

Докладніше про те, як налаштувати тарифи курсів, дивіться в статті «[Плани онлайн-курсу](/doc/uk/lms/builder/plans.md)".
{% endhint %}

### Кнопка з функцією онлайн-бронювання

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

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

{% hint style="info" %}
Ми вже розповідали про налаштування розділу послуг у [ «Онлайн-бронювання»](/doc/uk/booking/settings.md) статті.
{% endhint %}

У налаштуваннях кнопки виберіть функцію «Онлайн-бронювання» та у випадаючому меню виберіть віджет, який потрібно показати під час натискання на кнопку.

### Кнопка функції посилання на месенджери

Щоб клієнт перейшов із вашого сайту до бота в месенджері, наприклад Telegram або WA, ви можете скористатися функцією кнопки «посилання на месенджер» або розділом «Форма».

<figure><img src="/files/a66bae40ce89c73d7d6fcfe9ef80fc948b1eaa2d" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Докладніше про [«Форм](/doc/uk/websites/saiti/blocks/forms.md)» у статті з однойменною назвою.&#x20;
{% 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/saiti/blocks/buttons.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.
