Для настройки интерфейса диалогов перейдите на вкладку Дизайн редактора бота.
На вкладке Дизайн вы можете задавать настройки на панели слева и сразу же видеть их применение в диалоге справа. Диалог содержит все элементы, которые могут быть добавлены в бот - просмотрев его, вы увидете, как будет выглядеть ваш диалог не только сейчас, но и при изменении схемы.
Обратите внимание, что область просмотра содержит вкладки Чат и Список. На вкладке Список вы увидите применение стилей для списка ранее начатых диалогов.
Интерфейс
В блоке Интерфейс содержатся настройки для всего диалога и списка диалогов.
Подсказка ввода
Текст, который будет указан в поле ввода диалога
Фон чата
Общий фон чата и списка чатов
Для задания цвета вы можете: - Выбрать вариант из предложенных - Задать цвет на палитре - Ввести HEX-код цвета
Текст
Цвет текста в списке, а также цвет заголовка, даты, времени, подсказки ввода и пр.
Границы UI
Цвет разделительных линий между названием, диалогом и полем ввода
Ошибки
Цвет фона сообщений об ошибке, любого ошибочного поля ввода на форме, а также фон сообщения с ошибкой загрузки файла
Текст ошибки
Цвет текста в элементах, описанных выше
Акцент
Цвет кнопки отправки сообщения, цвет кнопки Новый диалог и метки новых сообщений
Акцентированный текст
Цвет текста в кнопке Новый диалог
Разделители
Цвет разделителя в заголовке диалога, цвет разделителей в списке диалогов
Шрифт
Шрифт в диалогах и списке
Выбирается из списка. Шрифт задается для всего чата сразу. По умолчанию - Roboto
Размер шрифта
Размер шрифта в диалогах и списке
Размер выбирается на шкале и изменяется пропорционально для всех элементов чата сразу
Заголовок
В блоке Заголовок вы можете настроить внешний вид заголовка:
Отключить – кнопка позволяет убрать заголовок из окна чата. Чтобы вернуть заголовок, нажмите кнопку Подключить
Логотип – изображение в заголовке чата. Для смены изображения нажмите кнопку Загрузить, выберите изображение и откройте его. Изображение появится в логотипе заголовка чата. Для возвращения к стандартному логотипу нажмите Удалить.
Сообщения бота
В блоке Сообщения бота вы можете настроить сообщения бота и оператора.
Фон
Цвет фона списков и строк ввода в сообщениях бота и оператора
Для задания цвета вы можете: - Выбрать вариант из предложенных - Задать цвет на палитре - Ввести HEX-код цвета
Текст
Цвет текста сообщений бота и оператора
Сообщения
Цвет фона сообщений бота и оператора
Акцент
Цвет различных элеметов в сообщениях бота или оператора, например: кнопок, ссылок, текста в списке выбора и пр.
Акцентированный текст
Цвет текста в кнопках и списках в сообщениях бота и оператора
Разделители
Цвет разделителей для формы ввода и списков в сообщениях бота и оператора
Аватар
Аватар для сообщений бота или оператора
Для смены изображения нажмите кнопку Загрузить, выберите изображение и откройте его. Изображение появится в аватаре. Для возвращения к стандартному аватару нажмите кнопку Удалить.
Сообщения респондента
В блоке Сообщения респондента вы можете настроить сообщения респондента.
Фон
Цвет фона в сообщениях респондента
Для задания цвета вы можете: - Выбрать вариант из предложенных - Задать цвет на палитре - Ввести HEX-код цвета
Текст
Цвет текста в сообщениях респондента
Акцент
Цвет ссылок в сообщениях респондента
Пользовательский CSS
Если описанных настроек недостаточно, вы можете прописать стили в правилах CSS в блоке Пользовательский СSS.
Перед применением стилей Bot.one обязательно проверит код и подчеркнет ошибки.
Примечание
Правила, написанные в CSS, являются более приоритетными - то есть перекрывают правила, указанные в блоках
Сбросить настройки интерфейса
Чтобы сбросить настройки дизайна в диалогах, нажмите кнопку Сбросить настройки дизайна в правом верхнем углу.
