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

Последние изменения: 14.05.2021

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

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

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

Если вы предпочитаете видеоформат — можете посмотреть руководство по виджетам на нашем Youtube-канале.

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

Для кнопки виджета можно выбрать формат, место расположения, иконку и цветовую тему. Изменения в режиме реального времени мы отображаем в окошке предпросмотра справа. Также вы можете посмотреть полноэкранную версию виджета, кликнув на кнопку под окном предпросмотра.

5b32805e131ce6da603489d6cfe8a5fc.gif
Формат и расположение

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

98f9867d52463348f3506f00fe657004.gif

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

2c82da506ba2dd3e426993b093225fa6.gif

Темы для виджетов полностью соответствуют темам центра поддержки. Можно как комбинировать разные цвета, так и задать одинаковую палитру для центра поддержки и виджета.

Подсказка

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

https://138018.selcdn.ru/KB_images/omnideskru/1/188940/b923ba1527c96cd30ecc7d92af5acf99.gif

Также подсказки при наведении курсора на кнопки виджета отображаются и для всех остальных каналов.

115ac8c262da597730c9e30daef5ead0.gif

Типы виджетов и их настройка

739ae6981c6f53ae950ed8d53798d3a9.png


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

База знаний → Запрос: этот вариант удобен, если клиенты часто пишут вам простые однотипные вопросы, и вы хотите разгрузить сотрудников.

Все каналы: этот тип виджета собирает в себе все возможные способы связи с вами, включая каналы «База знаний» и «Предложения»: клиенты свободны в выборе и поступают так, как им удобнее.

Только почта: подойдет, если вы планируете принимать обращения от клиентов только через форму обратной связи.

Только мессенджеры: клиенты смогут связаться с вами через соцсети и мессенджеры.


«База знаний → Запрос»

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

Подсказка PRO: выстроенная схема «самообслуживания» поможет разгрузить команду и одновременно повысить удовлетворенность клиентов вашим сервисом. Чтобы это сработало, нужно наполнять и поддерживать в актуальном состоянии вашу базу знаний.

Настройки

1. В настройках можно выбрать, что будут видеть клиенты после клика по виджету:

а) только форму поиска:

35175ce2a6d2aeb161648391ad8596ed.gif

б) форму поиска и до пяти статей базы знаний, которые вы рекомендуете к прочтению:

b546cbe99a34c21b20226d1f0e11af64.gif

2. Затем выберите каналы связи, по которым клиенты смогут к вам обратиться. Доступны все из числа подключенных к сервису.

e612114b7e6f94d2dbfcd46caffd06a2.png

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

7b2145f9859092d3738e0191843587eb.png

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

Перейти к разделу:


«Все каналы»

Этот тип виджета собирает в себе все способы связи с вами, включая каналы «База знаний» и «Предложения», которые дублируют соответствующие разделы из вашего центра поддержки. То есть клиенты смогут:

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

  • прямо в окне виджета, без перехода в сам центр поддержки, самостоятельно поискать ответ в базе знаний;

  • оставить своё предложения или проголосовать за предложения других клиентов.

Добавьте все нужные вам каналы. При добавлении каналов «База знаний» и «Предложения» указывается подсказка, появляющаяся при наведении курсора, задаются иконка и её цвет, а также выбирается, какая страница / категория откроется по умолчанию. 

383b76d4387ad8fc6762f39352815dd7.png

Так будет выглядеть взаимодействие с базой знаний через виджет:

5eaa2e690922410dedae7fd1e1743ebe.gif


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

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

d26a83aee7a55dc8b8b47e05dff76567.gif

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

Перейти к разделу:


«Только почта»

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

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

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

18bd0640aef26c3650dd94ed54de1386.png

а) Если вы хотите добавить кастомное поле, чтобы клиенты указывали в них нужную вам информацию, например номер договора, тип аккаунта и т. д., сначала создайте эти дополнительные поля в аккаунте администратора по пути Каналы — Поля данных. Подробнее 

b4ecd14d1bda9a77449e0f656ffcb204.png

Затем добавьте нужные поля в форму обратной связи и укажите с помощью звездочки, будет ли оно обязательным для заполнения или нет.

d824d1961ba49ad10e7aeb165228838f.gif

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

в) Чек-бокс «Текст о согласии на обработку персональных данных» открывает блок для добавления ссылки на соглашение об обработке персональных данных. Но добавить сам текст уведомления и ссылку, по которой такое соглашение размещено на вашем сайте, вам нужно вручную.

https://138018.selcdn.ru/KB_images/omnideskru/1/188940/a8687a2e817a53387456a59df105b735.gif

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

Когда ссылка на соглашение об обработке персональных данных добавлена в виджет, форма для отправки запроса получает следующий вид:

https://138018.selcdn.ru/KB_images/omnideskru/1/188940/d4f4121381a515712b5c04ef48733ec7.png

г) На последнем шаге вы можете выбрать, что произойдёт после отправки запроса: вывести сообщение об успешно созданном обращении, просто закрыть виджет или выполнить редирект на какую-то страницу.

0c16c150d408192bada20a13430db2a3.png

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

Перейти к разделу:


«Только мессенджеры»

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

Перейти к разделу


Особенности добавления канала ВКонтакте

При добавлении канала ВКонтакте есть возможность выбрать обычную ссылку или виджет соцсети:

0a49f92f5ba452fbcd9ce0d5e2383199.png

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

https://138018.selcdn.ru/KB_images/omnideskru/1/188940/238658c4f69f7df74af0ffebd33c11e1.png

При выборе опции «виджет соцсети» не забудьте разрешить его использование в настройках сообщества в ВКонтакте.

3149ec194f038fbc954b17250a600926.png


Добавление кастомных кнопок

Во всех типах виджетов, кроме «Только почта», можно добавлять кастомные кнопки. Используйте их, чтобы собрать в виджете ссылки на все полезные ресурсы: можете добавить ссылку на базу знаний, API-документацию или страницу с калькулятором стоимости услуг.

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

https://138018.selcdn.ru/KB_images/omnideskru/1/188940/9e3ed67a02e84bfe5f35c201c7e4aed9.gif


Добавление виджета на сайт

Сразу после создания виджета откроется модальное окно с кодом, который вам нужно скопировать и вставить на страницу вашего сайта:

https://138018.selcdn.ru/KB_images/omnideskru/1/188940/a71a0d4f2f4f4af4447fbf777415d20a.png

Добавить виджет в ваш центр поддержки можно в аккаунте администратора по пути Центр поддержки — персонализация — виджеты и скрипты. Подробнее

https://138018.selcdn.ru/KB_images/omnideskru/1/188940/34b55eac069bcec9671d150cc74d4bb1.gif


Мультиязычность в виджете

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

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

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

1. Если в Омнидеске добавлено несколько языков, то при создании любого типа виджета появится пункт для выбора языка, на котором будет отображаться виджет.

https://138018.selcdn.ru/KB_images/omnideskru/1/188940/64e551c9b1f454ba7e99b61407fd6a34.png

Подробнее о каждом варианте:

а) Язык, установленный в браузере пользователя

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

https://138018.selcdn.ru/KB_images/omnideskru/1/188940/9dc7ba0cd84a40fbd31d46627ab804d6.gif

Если в браузере пользователя выставлен язык, который добавлен в вашем аккаунте в Омнидеске, то виджет отобразится именно на нем (при условии, что при создании виджета вы перевели все фразы виджета на этот язык). Если в браузере пользователя выставлен язык, которого НЕТ в вашем аккаунте в Омнидеске, то виджет отобразится на языке, установленном по умолчанию (отмеченном звёздочкой).

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

https://138018.selcdn.ru/KB_images/omnideskru/1/188940/fd10a7980054a61e7faaa5ea47685cda.png

б) Язык, установленный в центре поддержки

Эту опцию следует выбирать, если вы используете центр поддержки Омнидеска и создаёте виджет, который будет размещён именно в центре поддержки (аккаунт администратора — раздел «Центр поддержки» — подраздел «Персонализация» — блок «Виджет»). При выборе этой опции язык виджета будет зависеть от языка, выбранного в центре поддержки.

https://138018.selcdn.ru/KB_images/omnideskru/1/188940/7722fb4f948151b09684698de73cf5e5.gif

При первом посещении центра поддержки неавторизованный пользователь видит его на языке по умолчанию. Если он поменяет язык, мы сохраним его в cookies на 30 дней, и при следующем посещении страница будет открываться на языке, выбранном в прошлый раз. Если с последнего визита пройдёт более 30 дней, то мы отобразим центр поддержки снова на языке по умолчанию.

в) Конкретный язык

Если при создании виджета в пункте «Язык» выбрать какой-то конкретный язык, то виджет будет всегда отображаться именно на этом языке. Этот вариант стоит использовать, если вам нужны разные виджеты (разного типа, с разными полями в форме и т. п.) для каждого языка.

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

https://138018.selcdn.ru/KB_images/omnideskru/1/188940/b923ba1527c96cd30ecc7d92af5acf99.gif

Перевод всех стандартных фраз на английский язык мы уже добавили ✅

3. В двух случаях индикаторы языков работают не для конкретного поля, а для всего блока.

а) При создании виджета типа «База знаний+почта» в блоке для выбора рекомендуемых статей индикаторы языка отслеживают, у всех ли выбранных статей есть переводы на другие языки. Если хотя бы для одной статьи перевода не будет, индикатор загорится красным цветом.

https://138018.selcdn.ru/KB_images/omnideskru/1/188940/d493485ac3ca9cd17d3af1c9c5a03618.gif

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

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

Если для какого-то поля у вас не будет перевода для некоторых языков, то вы можете либо добавить перевод названия поля в его настройках (аккаунт администратора — раздел «Каналы» — подраздел «Поля данных»), либо просто переименовать название поля на другой язык прямо во время создания виджета.

https://138018.selcdn.ru/KB_images/omnideskru/1/188940/dfba262436e941a465913643b0aff6ac.gif


Прочие моменты

1. Виджеты поддерживают идентификатор JavaScript-событий, которые можно использовать для настройки целей в Яндекс.Метрике, Google Analytics и других аналогичных сервисах.

2. Размер вложений, отправляемых через форму обратной связи в виджете, — 20 МБ

3. Можно подключить собственную форму обратной связи к сервису через API: в этом случае получится использовать свои дизайн.

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

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

6. Если ваш сайт сделан на Wordpress, ознакомьтесь с инструкцией по добавлению и настройке виджетов тут.

7. Для виджетов есть API, с помощью которого можно управлять отображением виджета на странице. Подробнее

8. Во время тестового периода в виджете отображается ссылка на сайт Омнидеска. Сразу после оплаты сервиса она пропадает.

Помогла ли вам статья?