Подключение, настройка и возможности виджета

Содержание


Подключение виджета

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



Затем выберите «Чат».



Внизу страницы с настройками указан код виджета. Как только виджет будет готов к публикации, скопируйте скрипт и попросите вашего администратора сайта разместить скрипт перед закрывающим тегом. Если размещаете виджет через Google Tag Manager, воспользуйтесь инструкцией.


Виджет можно добавить в вашу Базу знаний в Юздеске. Для этого скопируйте код виджета и зайдите в раздел «База знаний» → «Редактировать».


Вставьте скопированный код виджета в поле «Скрипты в подвале» и нажмите «Сохранить»:


Готово, теперь виджет будет отображаться в вашей Базе знаний!


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

Карточка настройки виджета состоит из 9 блоков:


Блок «Виджет»

Общие настройки виджета:

  • Название канала — обязательное поле. Введите название канала, которое будет отображаться в общем списке каналов в разделе «Каналы» и использоваться в Юздеске (фильтры, карточка запроса, настройки и т. д.);



  • Язык — язык системных сообщений и кнопок в виджете. Выберите тот, на котором говорят ваши клиенты. По умолчанию система выбирает тот язык, который установлен в настройках компании;
  • Цвет — главный цвет виджета для шапки и кнопок;
  • Текст в шапке — обязательное поле. Укажите заголовок в шапке чата;
  • Текст подписи — текст внизу виджета, например для предупреждения о сборе персональных данных. Отображается в форме обратной связи и в чате при выключенной настройке в блоке «Чат» — «Не запрашивать почту». Лимит по количеству символов — 255.

    Чтобы добавить в текст подписи гиперссылки (на текст политики обработки персональных данных или другие ресурсы), добавьте html-код по образцу:



    Вместо https://usedesk.ru/privacy используйте ссылку на ваш документ;
  • Разрешить вложения — поставьте галочку, чтобы разрешить клиентам отправлять в чат вложения;
  • Разрешить оценку — выберите этот пункт, если хотите, чтобы у клиента была возможность оценить диалог в чате виджета. Клиент сможет оценить качество поддержки, нажав на звёздочку;


  • Текст подсказки оценки — текст, который будет отображаться при наведении на звёздочку. Например, «Ваш вопрос решён?» или «Оценить качество поддержки»;
  • Приоритет отображения (z-index) — индекс определяет приоритет отображения виджета среди слоев других элементов вашего сайта. Например, если индекс виджета ниже, чем индекс основной картинки на сайте, то виджет отображаться не будет (картинка будет в приоритете);
  • Показывать кнопку отправки в Базе знаний — галочка активирует кнопку обратной связи из виджета «Написать нам», если клиент пользуется поиском или читает одну из ваших статей;
  • Задержка для пропущенных — укажите количество секунд, через которые чат из виджета будет считаться пропущенным, если клиенту не ответит агент. Важно, что система реагирует только на первый ответ агента в новых или переоткрытых чатах.

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

    При незаполненном значении система автоматически переведет количество секунд в 0 и ни один чат из виджета не будет считаться пропущенным. Продолжить работу с пропущенными чатами агент может в разделе «Запросы» — фильтр «Пропущенные чаты» (или в чате выбрать фильтр «Пропущенные»);

  • Максимум чатов на одного агента — укажите максимальное количество чатов, которое может быть у одного агента. Система распределит чаты равномерно между всеми агентами до указанного количества в настройке.

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

    При незаполненном значении система автоматически переведёт количество чатов в 0, и распределение чатов будет работать без ограничений по количеству;

  • Разрешено отвечать, если клиент офлайн — поставьте галочку, чтобы агенты могли отвечать клиенту, даже если он уже ушёл с сайта и не в сети. Включайте эту настройку, если вы уверены, что клиент вернется в виджет в ближайшее время;

  • Скрывать при клике вне области — поставьте галочку, если хотите, чтобы виджет сворачивался при клике вне его области. Это удобно, чтобы виджет не мешал комфортной работе с сайтом после общения с поддержкой. По умолчанию настройка включена;

  • Автоматическое распределение — поставьте галочку, если хотите, чтобы система назначала исполнителем чата другого агента, когда клиент напишет сообщение в чат, а текущий исполнитель будет в статусе «Офлайн». Юздеск назначит исполнителем агента в статусе «Онлайн» с наименьшим количеством чатов. Подробнее об автоматическом распределении читайте по ссылке;

  • Разрешено завершать только свои чаты — поставьте галочку, и агент сможет завершить только те чаты, которые назначены на него;

  • Показывать виджет — выберите отображение виджета на сайте: всегда, в рабочее время (используется рабочее время групп агентов для отображения чат виджета, а рабочее время компании для отображения всего виджета), никогда;

  • Нет сообщений (ч) — если за указанное количество часов в канале не появится новых сообщений, Юздеск отправит уведомление администраторам.

Важно! Для внутренней безопасности Юздеск переименовывает вложения от клиентов следующего формата:

.aru .msc .sfx .tmp .py .pif .application .wmf .msp .com .cmd .dll .apk .bat .bin .cgi .cmd .com .cpp .js .jse .exe .html .hta .htm .vbs .vb .phtml .gadget .gtp .hta .jar .scr .cpl .msi .msu .msp .paf .ps1 .pwz .scr .thm .vb .vbe .vbs .ws .wsc .wsh .wsf .php .jse .ps1 .ps1xml .ps2 .psc1 .psc2 .lnk .inf .scf .msh .msh1 .msh2 .mshxml .msh1xml .msh2hml .reg .doc .xls .ppt .docm .dotm .xlsm .xltm .pptm .potm .ppam .ppsm .sldm .gzquar .zix .ocx .ozd .class .swf .drv .chm .pgm .sjs .xlm .dev .vba .vbe .pif .tsa .vxd .hlp .sop .xnxx .386 .tps .boo .vb .pcx .rhk .bkd .exe1 .dxz .osa .lik .cih .dyz .9 .mfu .z7p .dlb .kcd .dyv .mjz .php3 .dom .hlw .wsc .vbx .fnr .cla .rsc_tmp .wlpginstall .dli .xir .mjf .bhx .mcq .bup .upa .dllx .xdu .xlv .cxq .bxz .ska .wsh .cfxxe .txs .qrn .fag .tti .bll .vexe .xtbl .uzy .smtmp .tko .oar .ceo .scr .smm .plc .cc .ssy .ctbl .spam .dbd .blf .ce0 .iws .zvz .vzr .hsq .rna .aepl .nls .lkh .let .aut .delf .fuj .ezt .buk .bmw .hts .atm .iva .dx .bqf .qit .pr .bps .fjl .capxml .cyw .pid .lpaq5 .lok .xnt .0_full_0_tgod_signed

Например, .doc переименуется в .doc.dangerous_format.txt


Блок «Кнопка»



Настройка отображения кнопки виджета:

  • Количество волн — задайте полю любое значение больше единицы, чтобы ваш виджет привлекал к себе больше внимания — именно столько раз иконка будет мигать после загрузки страницы;
  • Время появления — количество секунд, через которое виджет появляется на странице сайта, где он установлен;
  • Положение — положение кнопки виджета на странице: справа, слева;
  • Цвет — фон кнопки виджета;
  • Иконка — загрузите иконку для виджета (картинку или гифку) или используйте иконку по умолчанию — фирменное лого Юздеска. Формат иконки может быть .png, .jpeg, .webp, .gif, .svg.


Блок «Подсказка»



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

  • Показывать — выберите вариант, когда нужно отображать подсказку в виджете: всегда, никогда, при наведении;
  • Цвет фона — цвет фона подсказки;
  • Текст — текст подсказки для виджета. Введите подсказку на том языке, на котором общаются ваши клиенты;
  • Цвет текста — цвет текста подсказки;
  • Размер текста — размер текста подсказки.


Пример настроенной подсказки в виджете:


Блок «Форма обратной связи»


Настройка формы обратной связи:

  • Создавать запросы через канал — выберите почтовый канал, через который будет поступать обратная связь от клиентов в раздел «Запросы»;
  • Показывать — выберите вариант, когда нужно отображать форму обратной связи в виджете:
    • только в нерабочее время. Используется настройка рабочего времени групп агентов, в остальное время — чат с поддержкой. Если в рабочее время не будет агентов в статусе «онлайн» с доступом к каналу, ФОС тоже будет отображаться;
    • всегда только ФОС. Чат с поддержкой отображаться не будет;
    • всегда ФОС+чат. При открытии виджета будет доступна ФОС, а после заполнения откроется чат с поддержкой;
    • никогда. Всегда отображается чат с поддержкой, даже если в Юздеске нет ни одного агента в статусе «онлайн» с доступом к каналу.
  • Заголовок окна — укажите название формы. Если оставите поле пустым, то на стороне клиента отобразится стандартное «Обратная связь»;
  • Приветствие — добавьте текст приветствия, которое отправится клиенту от имени бота компании при заполнении формы обратной связи. По умолчанию бот отвечает от имени «UseDesk Bot», если в настройках бот не переименован. Также имя бота можно задать в настройке виджета в блоке «Чат» → «Заменить имя оператора на», и бот ответит от заданного в поле имени. Текст можно делить на абзацы с помощью Enter или тега — его нужно вставлять в строку между абзацами. Лимит по количеству символов — 255;
  • Темы обращений — обязательное поле. Укажите темы, чтобы клиент мог выбрать подходящую тему обращения. Тема станет заголовком входящего запроса. Отметьте галочками темы, которые будут отображаться в ФОС;
  • Заголовок темы — напишите текст подсказки клиенту;
  • Обязательность темы — поставьте галочку, чтобы сделать выбор темы обязательным;
  • Дополнительные поля — поля в форме с любой дополнительной информацией. Например, «город», «номер заказа» и т. д. Отметьте чекбокс ниже, чтобы добавленные поля были обязательными для заполнения;
  • Дополнительные поля запроса — поля, которые вы создаёте в разделе «Настройки» → «Дополнительные поля» и заполняете при работе с запросом. Можете вывести в ФОС несколько полей. Заполненные поля после отправки ФОС будут автоматически заполнены в созданной карточке запроса. Действия, указанные в настройках дополнительного поля, будут выполнены. Например, можно вывести в ФОС доп. поле с выпадающим списком:


  • Заголовок результата — заголовок текста, который будет показываться клиенту после отправки заполненной формы. Если оставить поле пустым, по умолчанию будет отображаться текст «Успешно отправлено!»;
  • Текст результата — текст, который будет показываться клиенту после отправки заполненной формы. Если оставить поле пустым, по умолчанию будет отображаться текст «Ваше сообщение было успешно отправлено! Наши специалисты свяжутся с вами».

Пример настроенной формы обратной связи:



Блок «Чат»


Настройка чата с поддержкой:

  • Звук — звук нового сообщения от агента в виджете. Если хотите, чтобы сообщения приходили без звука, оставьте «не выбран». Либо выберите один из пяти звуков, прослушав их. При желании клиент может отключить звук в виджете;
  • Заменить имя оператора на — замените имена операторов и бота одним именем;
  • Не запрашивать почту — поставьте галочку, чтобы не запрашивать почту клиента перед началом чата. Помните, что в этом случае вы не сможете автоматически идентифицировать клиента в системе и посмотреть историю его обращений;
  • Приветствие — сообщение, которое клиент получит от вас сразу, как только начнёт чат. Текст можно делить на абзацы с помощью Enter или тега

    — его нужно вставлять в строку между абзацами;
  • Реакция на приветствие — поставьте галочку, чтобы клиенту отправлялся текст из окошка ниже (пункт «Текст реакции на приветствие»), если он напишет «привет», «здравствуйте», «добрый день». Эти слова можно редактировать, т. е. добавить по запросу. Напишите в нашу поддержку;
  • Текст реакции на приветствие;
  • Цвет текста кнопки в сообщениях настройте кнопки в виджете для автоматизации переписки и задайте в этом поле цвет текста кнопок;
  • Цвет фона кнопки в сообщениях.


Пример настроенного чата:


Блок «Настройка пунктов»

Настройка иконок, которые будут отображаться клиенту.


Чтобы иконка появилась в виджете, нажмите кнопку «Добавить» и задайте значения в любом порядке. В настройке есть возможность изменять порядок набранных значений с помощью перетаскивания (drag-n-drop).

Напротив нужного пункта заполните:

  • Тултип — всплывающая подсказка. Если поле не заполнено, подсказка не отображается;
  • Картинку — вид вашей кнопки. Наведите на иконку, заданную по умолчанию, нажмите «плюс» и добавьте свою картинку (размер — не более 20 Mb, 48 на 48 пикселей, допустимые форматы: ico, svg, bmp, jpg, gif, png);
  • Ссылку или элемент из списка для следующих значений:
    • База знаний — если у вас несколько Баз знаний в аккаунте, выберите ту, которую нужно отображать в конкретно этом виджете. По умолчанию выбрана первая База знаний из списка. База знаний всегда будет располагаться вверху списка в виджете вне зависимости от её расположения при настройке;
    • ВКонтакте — id страницы/группы;
    • ФБ* — ссылка на диалог с вашей компанией в мессенджере ФБ*;
    • Viber — ссылка на паблик (https://invite.viber.com/?...) или на номер телефона (viber://chat?number=%2B...);
    • Telegram — ссылка на бота или аккаунт (из-за блокировок в России обычная ссылка может не работать, поэтому можно использовать сервисы с альтернативными ссылками);
    • Одноклассники — ссылка на диалог с группой;
    • Insta* — ссылка на профиль;
    • WhatsApp — номер телефона без пробелов и лишних символов (плюсы, дефисы, скобки), только цифры;
    • Skype — ссылка на чат;
    • Ссылка — внешняя ссылка.

Добавляйте чат, мессенджеры, социальные сети через заданные значения, а также используйте поле «Ссылка», чтобы добавлять необходимые для вашей компании каналы через внешнюю ссылку.


Важно! Общее количество иконок в виджете ограничено — 10 шт.

Пример настроенных пунктов:


Включение мессенджера в виджете не интегрирует его с Юздеском. Для подключения мессенджеров воспользуйтесь инструкциями.


Наш тестовый виджет

У нас есть страничка с тестовым виджетом — https://usedesk.ru/widgettest

На ней вы можете посмотреть, как работает виджет, формы в чате виджета и кнопки.

В виджете настроены два правила: одно отправляет форму при нажатии на кнопку, другое — текст. Вот, как они настроены:

Правило с текстом


Правило с формой


Идентификация пользователя

Если позволять клиентам писать в ваш виджет без их идентификации, они не будут опознаны системой. Кому-то вариант без идентификации клиентов подходит, но у неё есть несколько плюсов. Например:

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

Есть несколько способов идентифицировать пользователя:

1) Запрос почты перед началом чата. В настройках канала виджета в блоке «Чат» есть пункт «Не запрашивать почту».


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


2) Форма обратной связи. Используйте форму обратной связи вместе с чатом или отдельно.


При включенной форме обратной связи виджет по умолчанию будет запрашивать имя и e-mail.


3) Автоидентификация с помощью API. Если у пользователей на вашем сайте есть личные кабинеты, можно настроить передачу данных с вашего сайта в Юздеск по API. Тогда пользователям не придётся заполнять личные данные при использовании виджета и они всегда будут идентифицированы — никаких «неопознанных слоников» или «кроликов» :)

Работает это с помощью параметра useridentify — подробнее читайте в нашей документации API по ссылке.


Кнопки для прямого контакта

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

Чтобы настроить кнопку, с помощью которой клиент сможет написать вам на почту, в блоке «Настройка пунктов» добавьте пункт «Ссылка», а в окошке «Ссылка» пропишите mailto:test@test.ru. Вместо test@test.ru укажите почту, на которую клиенты будут писать вам.


Чтобы настроить кнопку, с помощью которой клиент сможет позвонить вам, в блоке «Настройка пунктов» добавьте пункт «Ссылка», а в окошке «Ссылка» пропишите tel:+79998887766. Вместо +79998887766 укажите телефон, на который клиенты будут звонить вам.


Лимиты

  • Максимальный размер отправляемых файлов в ФОС — 15 Мб;
  • Максимальный размер отправляемых файлов в чате — 50 Мб;
  • История переписки в чате у идентифицированного по API клиента сохраняется;
  • История переписки в чате у неидентифицированного клиента сохраняется до тех пор, пока у него не обновляется кеш браузера;
  • Лимит по количеству символов для текста приветствия и текста подписи в ФОС — 255.


Ошибки

Если при отправке сообщения возникнет ошибка, в правом верхнем углу система покажет уведомление «Не удалось отправить сообщение. Пожалуйста, напишите нам на support@usedesk.ru».

Ошибка будет видна только при отправке из интерфейса запроса.

Наша поддержка подскажет, что делать.


* Компания Meta, которой принадлежат продукты Insta и ФБ, на которые мы ссылаемся в данном материале, признана экстремистской на территории Российской Федерации.