# Виджеты

**Для этого нужно:**

1. Создать виджет
2. Выполнить "Настройки виджета"
3. Разместить код на сайте

{% hint style="info" %}
Создание виджета
{% endhint %}

Заходим в свой проект и нажимаем "Создать виджет"

<figure><img src="https://49415206-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FxxJzgLIMfD15nVewbHNz%2Fuploads%2Fo81wDe0xrvVry7gAMQzA%2Flh91LtkL0n.png?alt=media&#x26;token=c729cef3-7e4f-456e-aa4e-465cebb9bf83" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Настройка виджета
{% endhint %}

1. Выбираем слева — "Конструктор" и нажимаем справа внизу на "Шестеренку"

<figure><img src="https://49415206-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FxxJzgLIMfD15nVewbHNz%2Fuploads%2F6192zNTxlpZqmpPLxTVA%2F1.png?alt=media&#x26;token=d7a1d8ab-fd38-4e82-b06f-ef049b85c45b" alt=""><figcaption></figcaption></figure>

2. Переходим к настройкам:

* Заголовок
* Описание
* Ссылка
* Баннер
* Кнопка

{% hint style="warning" %}
Только после нажатия на виджет, появится данная информация!
{% endhint %}

Чтобы добавить обычную ссылку или ссылку на чат-бот, необходимо нажать на "Добавить ссылку" и потом на "Шестерёнку".

<figure><img src="https://49415206-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FxxJzgLIMfD15nVewbHNz%2Fuploads%2FsQHKqkwPRNixMLo5VOX0%2F3.png?alt=media&#x26;token=e0405c36-cc56-4d95-8e76-83db3533b211" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Установка кода на сайт
{% endhint %}

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

<figure><img src="https://49415206-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FxxJzgLIMfD15nVewbHNz%2Fuploads%2FzU4PezAhBotWfAVyigQ7%2F4.png?alt=media&#x26;token=dda1fd65-6181-40fe-91f3-04f1187dced8" alt=""><figcaption></figcaption></figure>

**Вот так выглядит виджет на сайте, после полной настройки:**

<figure><img src="https://49415206-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FxxJzgLIMfD15nVewbHNz%2Fuploads%2FmGyW7tKpNsQdrxLmfluT%2F33.png?alt=media&#x26;token=cf129a35-78ae-4246-9f67-2fc8d2742b35" alt=""><figcaption></figcaption></figure>