# Раздел "Окно чата"

В данном разделе пункта настроек **Кнопки и размещения** Вы можете настроить внешний вид окна чата.

Доступные настройки внешнего вида чата:

  * **Ширина диалога** — ширина виджета чата, указывается в пикселях. По умолчанию стоит 400.

  * **Высота диалога** — высота виджета чата, указывается в пикселях. По умолчанию стоит 600.

  * **Логотип** — графическое изображение, отображаемое в верхней части окна чата. Вы можете загрузить логотип, нажав на кнопку **Выберите файл**. После загрузки логотипа Вы можете загрузить новый, нажав на **Изменить** или удалить текущий логотип, нажав на **Удалить**. Вы можете загрузить изображения в форматах `PNG`, `JPG`, `JPEG`, `JPE` и `GIF`.

  * **Цвет окна диалога** — цвет фона «шапки» виджета, под аватаром и именем посетителя; цвет текста в шапке определяется автоматически, в зависимости от выбранного пользователем цвета фона. Для тёмного фона (<50% яркость) выбирается белый (`#ffffff`), для светлого фона — чёрный (`#000000`). В настройках размещения сохраняется как параметр `styles.header.background`.

  * **Второй цвет окна диалога** — чтобы сделать эффект градиента в «шапке», выберите второй цвет, и окраска будет перетекать сверху вниз от 1 цвета ко 2. В настройках размещения сохраняется как параметр `styles.header.gradient`.

  * **Цвет фона окна диалога** — в этот цвет будет окрашена основная часть виджета чата, в которой размещаются сообщения оператора и посетителя. В настройках размещения сохраняется как параметр `styles.body.background`.

  * **Цвет кнопок** — базовый цвет фона кнопок, которые отображаются в формах внутри виджета — например, при запросе контактов, вводе первого вопроса и т. п.: **Начать диалог**, **Отправить** и т. д. В настройках размещения сохраняется как параметр `styles.button.background`.

  * **Второй цвет кнопок** — чтобы сделать эффект градиента, выберите второй цвет кнопок, и окраска будет перетекать сверху вниз от 1 цвета ко 2. В настройках размещения сохраняется как параметр `styles.button.gradient`.

  * **Цвет фона сообщений оператора** — в этот цвет будет окрашена область, внутри которой размещаются сообщения оператора, чтобы визуально дополнительно выделить их из общего потока сообщений.

  * **Цвет фона сообщений посетителя** — в этот цвет будет окрашена область, внутри которой размещаются сообщения посетителя, чтобы визуально дополнительно выделить их из общего потока сообщений.

![Настройки окна чата](https://webim.ru/kb/img/control-panel/buttons-and-locations/chat-window/chat_window_settings.webp){ style="width: 883px; max-width: 100%" }

Необходимо отметить особенность работы сервиса при выборе отдела. Если Вы, делая выбор отдела обязательным, указываете какой-либо отдел из списка и отключаете его до сохранения размещения, то сохранить значения в поле **Доступные для выбора отделы** не удастся (будет выдана ошибка). Чтобы сохранить настройку размещения, необходимо либо включить отдел, либо убрать его из списка в данном поле. Если отдел был указан и сохранён в данном поле до отключения, то, в случае последующего отключения, он исчезнет из перечня доступных для выбора отделов. Если данный отдел был единственным, указанным для выбора, то при его отключении в качестве доступных для выбора отделов будут указаны все отделы. При включении отдела обратно он снова станет доступен для выбора посетителям.

Если стоит галочка в чекбоксе **Предложить оценить оператора перед закрытием диалога**, посетителю будет предложено поставить оператору оценку от 1 до 5 после того, как диалог с оператором будет завершён. Подробнее об оценках можно прочитать в [этой статье](https://webim.ru/kb/for-admins/rate.html).

Если стоит галочка в чекбоксе **Посетители должны вводить свой вопрос первыми, а также контактную информацию**, то чат будет начат только после первого сообщения посетителя.

## Экран «Первый вопрос» { #first-question }

**Назначение.** Экран отображается до начала диалога, если в размещении настроено предварительное заполнение данных посетителя и/или получение согласия на обработку персональных данных.

![Экран «Первый вопрос»](https://webim.ru/kb/img/control-panel/buttons-and-locations/chat-window/widget-first-question.webp){ style="width: 406px; max-width: 100%" }

### Состав экрана

  * Поля посетителя (например: `Имя`, `Телефон`) в соответствии с настройками размещения.

  * Поле «Сообщение» (если требуется отправка первого сообщения перед началом диалога).

  * Чекбокс «Согласие на обработку персональных данных» со ссылкой на текст согласия.

  * Кнопка «Добавить файл» — отображается, если в размещении разрешена загрузка вложений до начала диалога.

  * Кнопка «Начать диалог».

### Поведение

  * Экран отображается до создания чата в системе.

  * Список полей, их обязательность и маски ввода задаются в настройках размещения.

  * Обязательные поля и (при наличии) чекбокс согласия должны быть корректно заполнены, иначе кнопка «Начать диалог» недоступна или сопровождается сообщением об ошибке.

  * При повторном обращении неавторизованного посетителя, который ранее заполнил свои данные, поля могут быть предзаполнены сохраненными значениями.

!!! note "N.B."
    Если неавторизованный посетитель ранее дал согласие на обработку персональных данных и начинает новый чат, чекбокс согласия на экране «Первый вопрос» уже **проставлен**. Повторно отмечать его не требуется.

### Начало диалога

  * Если в размещении включено требование отправить первое сообщение, чат создается после отправки сообщения с экрана «Первый вопрос».

  * Если отправка первого сообщения не требуется, чат создается после нажатия «Начать диалог» при корректно заполненных полях.

  * При включенном механизме отдельного всплывающего окна согласия (см. ниже) начало чата блокируется до получения согласия.

### Взаимодействие с всплывающим окном согласия

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

  * Если согласие уже получено во всплывающем окне, на экране «Первый вопрос» чекбокс согласия отображается в состоянии «отмечен».

  * Если согласие еще не получено, чат не начнется, пока посетитель не подтвердит согласие (во всплывающем окне или через чекбокс, в зависимости от конфигурации).

Подробнее см. раздел [Подтверждение согласия на обработку персональных данных](https://webim.ru/kb/for-admins/personal-data-agreement.html).

---

Источник: https://webim.ru/kb/control-panel/buttons-and-locations/chat-window.html