# Інші розділи сайту

## Розділ «Заголовок і текст»

Цей блок використовується для додавання тексту на ваш вебсайт.

Ви можете використати наявний шаблон або створити власний (порожній), а потім налаштувати його відповідно до своїх уподобань.

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

Ви можете заповнити поле «Заголовок» або залишити його порожнім.

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

{% hint style="info" %}
Основні поля для форматування тексту заголовка та основного тексту такі самі, як і в [розділі «Обкладинка».](/doc/uk/websites/saiti/blocks/cover.md)
{% endhint %}

Ви можете форматувати текст, застосовуючи стилі (**Жирний**, *Курсив* , \~\~Закреслення\~\~, \<u>Підкреслення\</u>), змінюючи колір вибраного тексту та вирівнювання (ліворуч, по центру, праворуч або по ширині).

Ви також можете додавати списки (нумеровані або марковані) чи вставляти гіперпосилання в текст.

Крім того, змінні можна вставляти в обидва **Заголовок** та **Текст** поля.

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

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

<figure><img src="/files/88a2126ba65143eb7759ceb2f14ddfb60a8d9dfb" alt=""><figcaption></figcaption></figure>

## Розділ HTML

Цей розділ можна використовувати для додавання елементів до створеного вебсайту за допомогою кодів HTML і CSS.

<figure><img src="/files/0c30c4ef8da85ab2034ee8735a75dccb581022c7" alt=""><figcaption></figcaption></figure>

Код CSS працює для всього сайту, а не лише для поточного розділу!

Не рекомендується вставляти в блок HTML-коди з тегами \<script>.

Цей HTML-код виконується негайно, тут, у попередньому перегляді.

Щоб додати \<script>, скористайтеся розділом CSS і JS у налаштуваннях сайту.

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

## Розділ галереї

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

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

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

**Як додати зображення до розділу галереї**

Перейдіть на вкладку **Вміст** меню та завантажте там свої зображення.

<figure><img src="/files/03abc94a9e8eb2efed609246220b2277343f321a" alt=""><figcaption></figcaption></figure>

Ви можете завантажити до 20 зображень загальним розміром не більше 10 МБ.

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

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

Щоб вибрати стиль галереї, перейдіть до налаштувань:

<figure><img src="/files/201b2173b7a6c78f2eff0313ccdc78f504819b35" alt=""><figcaption></figcaption></figure>

За замовчуванням галерея має вигляд «Смуги». Однак ви можете змінити його на стиль «Плитки», «Полігони (на всю ширину)» або «Плитки (на всю ширину)».

<figure><img src="/files/627a60703d788af27aaf50c418c97dfbf3fcf3a3" alt=""><figcaption></figcaption></figure>

## Розділ медіа

Цей розділ дає змогу окремо від універсального блоку додати на ваш вебсайт будь-який медіафайл (зображення або відео). Ви можете використати готовий шаблон або створити власний порожній, а потім налаштувати його за потреби.

<figure><img src="/files/006e8f40fbe4217a6f62395279b5064e616f0401" alt=""><figcaption></figcaption></figure>

Основна відмінність між цим блоком і галереєю полягає в тому, що зображення/відео, додане до блоку, залишається статичним (тобто не прокручується, як у галереї):

<figure><img src="/files/8170f93338730b56557971fe55a1d6505b1cf870" alt=""><figcaption></figcaption></figure>

### Як завантажити вкладення

Після натискання кнопки «Додати блок» відкривається додаткове вікно з параметрами вибраного медіафайлу. У цьому вікні ви можете налаштувати параметри відображення файлу на вебсайті.

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

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

<figure><img src="/files/6118cd40211e17beeab3ea7c0c67242f8b8d6e86" alt=""><figcaption></figcaption></figure>

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

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

Після вибору медіафайлу ви можете відобразити текст і заголовок у блоці:

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

Ви можете форматувати текст за допомогою стандартних інструментів редактора, як і в інших блоках. Ви можете застосувати **жирний**, *курсив* , \<u>підкреслення\</u>, змінити розмір шрифту, колір тощо.

## Розділ цитати

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

<figure><img src="/files/55dd873e34b0e8a76b9ab0a06091b7082ab02c88" alt=""><figcaption></figcaption></figure>

Тип №1

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

Тип №2

<figure><img src="/files/556bda702d53e6bd005daf8b92a6837bc397fd81" alt=""><figcaption></figcaption></figure>

Цей блок досить легко налаштовується і містить одне текстове поле для цитати:

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

Текстове поле містить усі стандартні функції форматування: зміну регістру, *курсив*, **жирний** , \<u>підкреслення\</u> та інше. Ви також можете налаштувати колір тексту й підсвічування.

У **Налаштування вмісту** , ви можете вибрати стиль відображення цитати, обрати інший шрифт для блоку, налаштувати фон і змінити його вигляд.

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

## Розділ таймера

Блок таймера — це найцікавіше рішення для вашого вебсайту від і до потрібної дати в режимі анімації:

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

У блоці є два типи таймера:

* Реальний час

<figure><img src="/files/0d3420311efa559396a5c8334bd3a0c732ea11c5" alt=""><figcaption></figcaption></figure>

Як випливає з назви, таймер типу «реальний» починає відлік до заданих дати й часу певної події.

Наприклад, сьогодні 22.12.2025 (вівторок), а подія — конференція 30 грудня о 15:00.

Ми встановлюємо дату в календарі — 30 квітня, а в полі часу — 15:00.

<figure><img src="/files/2e46e9a64aba4dcae5f2fdc6915fc73ccb9355f2" alt=""><figcaption></figcaption></figure>

Таким чином таймер почне відлічувати час, що залишився до події:

<figure><img src="/files/5a5fe2ccf48ab54e179a717d619b6ab9fa5e227d" alt=""><figcaption></figcaption></figure>

* Циклічний

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

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

Наприклад, ваша знижка на підписку діє тиждень: ви можете встановити кінець акції через 7 днів у таймері. Система автоматично відрахує час до цієї дати, починаючи з моменту налаштування.

Також у цьому типі таймера можливо перезапустити таймер після завершення часу:

<figure><img src="/files/4e64ff0b80f4aa7697ede6686f2bd266f62a0ec7" alt=""><figcaption></figcaption></figure>

Різниця між таймерами типів «реальний» і «циклічний» полягає в тому, що в першому випадку час відраховується до певних дати й часу (до 30.04.2025 15:00), а в другому — за заданими значеннями часу (закінчується через 7 днів).

Крім того, ви можете вибрати налаштування кольору для цифр і фону таймера. Для цього перейдіть до налаштувань:

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

Тут ви можете налаштувати відображення мілісекунд, колір цифр, тексту та фону таймера.

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

## Розділ списку

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

Для цього натисніть «Додати елемент списку» в налаштуваннях блоку:

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

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

<figure><img src="/files/5870edc693884c82ff22587737f082f34dbe28a2" alt=""><figcaption></figcaption></figure>

Стиль тексту та списку можна змінити в налаштуваннях:

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

Стиль списку можна вибрати з запропонованих: «Без стилю», «Крапка», «Коло», «Квадрат», «Нумерований список».

<figure><img src="/files/762b777a41a6a716ae38c0c15882b454775a9521" alt=""><figcaption></figcaption></figure>

Стиль тексту можна змінити в налаштуваннях шрифту:

<figure><img src="/files/03f0d521b3804b9556fa1f7ca6820d6aeea10e84" alt=""><figcaption></figcaption></figure>

## Розділ випадаючого тексту

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

<figure><img src="/files/691c2f107b417783a71d21441e6879f8fb3b4b27" alt=""><figcaption></figcaption></figure>

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

<figure><img src="/files/5f4039ae2fab57fce4366441ab8af70e43713985" alt=""><figcaption></figcaption></figure>

У конструкторі є поля для заголовка, тексту, підказки та повного тексту, де для кожного поля можна задати контур шрифту, колір та інші параметри, подібні до текстового редактора:

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

Потім слід вибрати анімацію для тексту: миттєву або плавну. Для цього перейдіть до налаштувань:

<figure><img src="/files/8119ef5ff94dbb841f3c1f7b962c00ce2cf7eaa0" alt=""><figcaption></figcaption></figure>

Після цього ви можете налаштувати стиль шрифту в налаштуваннях шрифту.

<figure><img src="/files/6f1d76ee767457b4ce71b739de98d611f8aa1286" alt=""><figcaption></figcaption></figure>

## Розділ таймлайну

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

<figure><img src="/files/98ae15ffeba11f5164589d3565d5032c708e5f3a" alt=""><figcaption></figcaption></figure>

Щоб додати блок на сторінку, натисніть **"+"** кнопку. Потім виберіть **«Таймлайн»** зі списку розділів. Ви можете створити блок з нуля або скористатися готовим шаблоном.

<figure><img src="/files/1478e481a6ca764ba0d4aa68ef202cfe0c0f267d" alt=""><figcaption></figcaption></figure>

Щоб додати точку етапу в налаштуваннях блоку, натисніть кнопку з однойменною назвою:

<figure><img src="/files/309cd027fc7de428f588bc5cb526a718a92e8534" alt=""><figcaption></figcaption></figure>

Потім натискання на саму точку етапу відкриє поля для введення **name**, **title**, і **description** для цього етапу.

<figure><img src="/files/7433581c145bf1d43d675a8ca5e85b7f1df798fa" alt=""><figcaption></figcaption></figure>

Тут ви можете застосувати індивідуальні налаштування форматування до кожного текстового елемента, так само як у стандартному текстовому редакторі (курсив, підкреслення, колір тексту, вирівнювання тощо).

Далі виберіть стиль (з рамкою або без неї). Для цього перейдіть до налаштувань:

<figure><img src="/files/30275a6e580dacbce3a4615fe7a63d086db6a315" alt=""><figcaption></figcaption></figure>

Ви також можете налаштувати колір для кожного окремого елемента в розділі таймлайну.

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

## Розділ файлів

Цей блок знадобиться вам, щоб ділитися з користувачами релевантними даними.

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

Ви можете дозволити користувачам завантажувати файли, з такими обмеженнями: не більше 5 файлів загалом, із сумарним розміром не більше 20 мегабайт.

Перейдіть до налаштувань і виберіть файли, які ви хочете зробити доступними для завантаження.

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

Після завантаження аудіофайлу ви можете за бажанням увімкнути **«Відтворювати аудіо»** функцію. Це дозволить аудіо відтворюватися автоматично, коли користувач відвідує сторінку. Ви також можете ввімкнути **«Заборонити завантаження аудіо»** та **«Показати попередній перегляд»** параметри.

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


---

# 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/other.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.