Настройка виджета


Настройки виджета позволяют изменять цвета, добавлять и регулировать границы и отступы, а также придавать закругление различным элементам.

 

Настройки контента находятся в расширенном меню. Чтобы их увидеть, нужно включить слайдер "Расширенные настройки".

 
 

 

Настройки окна

 

Основная настройка окна - изменение размеров виджета.

 
 

Часть настроек находится в расширенном меню. Нажмите на слайдер "Расширенные настройки", чтобы их увидеть.

 

В расширенных настройках окна виджета есть следующие опции:

  • изменение закругления, отступов в шапке и шрифта;
  • добавление границы и тени;
  • выбор начального расположения.
 

В поле "Шрифт" помимо различных шрифтов можно выбрать опции "Системный шрифт" и "Как у body на вашем сайте".

При выборе варианта "Системный шрифт" в виджете будет использован шрифт, который является основным в вашей операционной системе.

Опция "Как у body на вашем сайте" означает, что шрифт в виджете будет таким же, как шрифт, используемый в "body" на вашем сайте.

 
 

Начальное расположение окна виджета зависит от расположения кнопки виджета на экране (о том, как изменить расположение кнопки, вы можете узнать в статье "Кнопка").

Например, при выборе опции расположения "Рядом с кнопкой", если кнопка виджета находится сверху посередине, то окно виджета откроется там же (сверху посередине). Отступ окна от верхней границы экрана будет соответствовать размеру кнопки.

 

Указанные ниже настройки можно отключить или включить по желанию:

  • разрешить изменять размер окна виджета;
  • разрешить перетаскивать окно виджета;
  • оставлять окно виджета открытым на ПК при переходе между страницами сайта;
  • закрывать виджет на смартфонах по нажатию на кнопку "Назад".
 
 

Также есть возможность изменить значение "z-index".

 

Данную настройку можно использовать, когда какой-либо элемент вашего сайта перекрывает окно виджета (или наоборот, окно виджета перекрывает элемент сайта).

Если вы хотите, чтобы виджет не перекрывал определенный элемент сайта (например, просмотр картинок), то значение "z-index" виджета должно быть установлено ниже, чем значение "z-index" элемента просмотра картинок.

 

 

Настройки контента

 

Настройки контента находятся в расширенном меню. Нажмите на слайдер "Расширенные настройки", чтобы их увидеть.

 

Поле "Контент" содержит следующие настройки:

  • Отступ. Регулирует размер отступа окна, в котором размещен контент, от границ виджета.
  • Закругление. Придаёт углам окна округлый вид.
  • Границы контента. Позволяет изменять размер и цвет границ окна.
 
 

 

Настройки чата

 

Настройки чата позволяют изменять следующие параметры:

  • отображение аватара в истории диалога;
  • отображение имени оператора в истории диалога;
  • параметры отображения шапки виджета в случае, когда не выбран оператор.
 
 

Отображение аватара в истории диалога

 

Когда эта настройка включена, в истории диалога рядом с каждым сообщением оператора будет отображен его аватар.

 
 

 

Отображение имени оператора в истории диалога

 

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

 
 

 

Параметры отображения шапки виджета в случае, когда не выбран оператор

 

Данная настройка будет применяться к следующим типам распределения диалогов:

 

Вы можете настроить заголовок, подзаголовок и аватар. Они будут отображаться в шапке виджета до тех пор, пока не станет известен оператор, с которым будет общаться посетитель.

 
 

 

Часть настроек находится в расширенном меню. Нажмите на слайдер "Расширенные настройки", чтобы их увидеть.

 
 

Рамка аватара оператора

 

Добавляет круглую рамку на аватар оператора. Цвет рамки будет таким же, как цвет текста шапки виджета. Настройки цвета описаны в статье "Цвета".

 

 

Закругление сообщений

 

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

 
 
 

Закругление отсутствует

 

Закругление максимально

 

 

Интервал между буквами

 

Регулирует расстояние между буквами в сообщениях. Чем выше выбранное значение, тем больше будет расстояние.

 
 
 

Минимальный интервал

 

Максимальный интервал

 

 

Нижняя граница диалога

 

Позволяет добавить в окно границу диалога, которая будет расположена в нижней части. Границе диалога можно придать закругление, изменить её размер и цвет. Высокое значение размера границы сделает её больше.

 
 
 

Нижняя граница диалога отсутствует

 

Максимально большая граница диалога

 

 

Поле для ввода сообщения

 

Дает возможность менять настройки поля, в котором пользователь вводит сообщение (до отправки в чат).

Вы можете изменить цвета фона, текста, кнопок (к ним относятся значок смайликов, прикрепления вложений, а также фоновый текст поля) и задать свой цвет кнопке "Отправить" (для этого включите слайдер "Свой цвет кнопки "Отправить" и выберите нужный вам цвет).

При включении опции "Отображать кнопку отправки всегда" кнопка "Отправить" будет отображаться в поле для ввода текста всегда (по умолчанию она отображается только в момент, когда сообщение готово к отправке). 

Так же полю для ввода сообщения можно придать закругление и добавить границу (её размер и цвет регулируются в поле "Граница").

Внешние и внутренние отступы текстового поля тоже могут быть изменены.

 
 

Внешние отступы определяют расстояние текстового поля от границ окна (слева, снизу и справа) и от нижней границы диалога (сверху). Чем выше значение, тем больше отступ.

Внутренние отступы изменяют расстояние вводимого текста от внутренних границ поля для ввода сообщений. Отступы регулируются по бокам (чем выше значение, тем дальше от боков будет расположен текст) и сверху/снизу (высокое значение увеличивает расстояние текста от верхнего и нижнего края текстового поля).

 
 
 

Поле ввода с базовыми настройками

 

Поле ввода с измененными настройками

5914 просмотра

Другие статьи по этой теме

Настройки цвета позволяют изменять внешний вид следующих элементов виджета: - кнопка открытия и шапка; - сообщения клиента и оператора; - ссылки и кн...
В настройках кнопки вы можете изменять её размер, стиль и расположение, а также заголовок и иконку онлайн и оффлайн режимов. Все настройки производят...
Меню кнопки виджета - это выпадающий из основной кнопки список действий. Настройки производятся для разных типов устройств (ПК, смартфон, планшет) и ...
Меню виджета - это список действий, отображаемый в окне виджета при клике на значок "Меню" (☰), расположенный в левом верхнем углу виджета. Настройки...
Уведомление - это текстовое сообщение, которое отображается у пользователя при закрытом окне виджета. Вы можете настроить различные типы уведомлений ...
CSS
Настройки CSS находятся в расширенном меню. Нажмите на слайдер "Расширенные настройки", чтобы их увидеть. CSS (Cascading Style Sheets или каскадные т...
Шаблон - это сохраненный набор всех настроек виджета. Любые изменения, которые вы делали в настройках, можно сохранить в качестве шаблона. Для этого ...