Виджеты 2.0

Виджеты — это один из подразделов платформы Fasttrack, Подраздел «Виджеты» позволяет генерировать скрипт виджета для вставки на ваш сайт.

Быстрая навигация:

• Шаги создания виджета

• (1) Общие

• (2) Каналы

• (3) Кнопка

• (4) Дизайн

• (5) Чат

• (6) Контекст

• Сохранение виджета

Чтобы создать виджет, нажмите на кнопку «Добавить виджет» в подразделе.

Откроется окно создания виджета с 6 шагами настроек для будущего виджета.

Разберём каждый из них более детально:

(1) Общие;

(2) Каналы;

(3) Кнопка;

(4) Дизайн;

(5) Чат;

(6) Контекст.

Шаги создания виджета

(1) Общие

На шаге «Общие» в левой части экрана настраивается название для будущего виджета. В поле «Установка виджета на сайт» скрипт появится после сохранения виджета.

В правой части отображён “визард” настройки виджета. Который показывает отображение виджета н при текущих настройках. Стандартно он показывает список каналов с кнопкой и чат. в дальнейшем можно будет изменить эти настройки на шаге (3) Кнопка.

Список каналов с кнопкой. Штатно выбраны 5 каналов и кнопка для их сворачивания.

В варианте виджета с чатом так же отображаются каналы и кнопка, но дополнительно отображён чат сообщения из которого будут доступны операторам в Чат-центре.

Управление статусом виджета имеет 2 варианта положения переключателя: Доступен и Недоступен.

Если перевести виджет в статус «Недоступен», то он не будет отображён на вашем сайте.

Дополнительно на первом шаге можно настроить варианты отображения виджета на различных страницах с делением на ПК и мобильные устройства.

Варианты отображения в зависимости от типа устройства представлены на 2 скриншотах ниже.

(2) Каналы

Шаг «Каналы» позволяет выбрать диплинк из имеющихся на вашем аккаунте. Если диплинков ещё нет, то можно более детально ознакомиться с их созданием в разделе Диплинки

Помимо выбора виджета второй шаг позволяет гибко настраивать варианты виджетов и менять их положение.

Зажав ЛКМ на элементе (2) его можно сместить выше или ниже.

Поставив или убрав галочку в чекбоксе мессенджера можно скорректировать колличество мессенджеров в виджете. Максимально доступно 8 вариантов.

В примере ниже убран один мессенджер и переставлены 4 оставшихся. Фактический вид представлен в правой части экрана, что позволяет до создания виджета понимать его конечный вид.

Если Список каналов переключить в “визарде” на Чат, то так же будет видно как расположены мессенджеры.

(3) Кнопка

На третьем шаге создания виджета стоит обратить внимание на поле выбора вариантов отображения.

Дефолтно (стандартно) отображён вариант «Кнопка + список каналов».

Всего есть четыре варианта отображения виджета. Далее рассмотрим оставшиеся варианты.

«Кнопка + обложка». Данный вариант имеет больше всего настроек для дизайна и содержания.

«Список каналов». Вариант отображения при котором нет кнопки для сворачивания мессенджеров, в отличие от дефолтного варианта.

«Полоска» является самым минималистичным вариантом отображения. Отлично подходит для сайтов со сдержанным дизайном или наоборот с перегруженным интерфейсом, где нужно минимизировать размер виджета.

Пример вариантов настроек для виджета «Кнопка + обложка»

Стандартно положение кнопки всегда «Справа», но данная настройка может быть изменена в данном выпадающем списке.

Стандартный отступ 20 и 20 px, но на примере ниже видно как можно сместить виджет на 40 раз относительно стандартного положения.

Нужно учитывать возможности экрана пользователей, если у вас на устройстве с 4к получилось сместить виджет на 2000 px, то у пользователя с разрешением экрана HD он может “уехать” за границу экрана.

Анимация виджета при скрытых вариантах мессенджера. Имеет 2 варианта: Без анимации или Пульсация. Выбирайте более подходящее решение под дизайн вашего сайта.

Приветствие можно настроить под текущую задачу - “Уважаемый клиент” или “Аладдин” как в примере ниже.

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

К примеру у Аладдина есть возможность 3 раза загадать желание, о чём его оповестили до общения с оператором в виджете на сайте.

(4) Дизайн

Четвёртый шаг «Дизайн» позволяет настроить цвета виджета и логотип отображаемый в чате.

Цвет активных элементов, таких как кнопок настраивается отдельно от цвета шапки.

Выбрать цвет можно при помощи палитры или зная HEXцвет****(в формате #000000)

HEX– шестнадцатеричная система представления цвета, которая использует арабские десятичные цифры от 0 до 9 и латинские буквы от A до F.

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

(5) Чат

На пятом шаге создания виджета можно задать ограничения на максимальный размер загружаемых файлов и их формат.

Примечание: Стандартно указаны все допустимые форматы файлов, можно сократить этот список, но дополнить нельзя.

Увеличивать размер файлов стоит осознанно, если дать пользователям виджета возможность загружать файлы не по 10, а по 1000 Мб это может существенно повысить нагрузку на ваш сайт.

(6) Контекст

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

Сохранение виджета

При сохранении виджета в верхней части экрана появится системное сообщение об успешной операции (1), а в центральной части откроется модальное окно (2) с скриптом для вставки на ваш сайт и ссылкой на встроенный чат. У каждой из этих двух строк есть иконка копирования упрощающая данный процесс.

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