Виджет — это код, вызывающий модальное окно с опросом по клику или без него, который добавляется на сайт. Достаточно единоразово добавить его на сайт, чтобы потом прямо через интерфейс FOQUZ добавлять, удалять и настраивать все остальные виджеты (в т. ч. из любого другого опроса).
Настройки виджета. Визуализация
При помощи настроек визуализации вы можете задать способ появления и внешний вид отображения виджета для прохождения опроса. В этих же настройках можно привязать ответы с виджета к определенному филиалу.
Есть два способа показа окна с опросом:
по клику: посетителю сайта нужно нажать на кнопку, шкалу или иконку, чтобы открылось окно с опросом;
без клика: вызов окна с опросом происходит автоматически без клика.
Ответам, полученным через виджет, можно присвоить какую-либо характеристику, по которой их можно группировать при анализе (например, конкретная страница, тип посетителя, когорта и т. п.). Для этого нужно привязать виджет к определенному Филиалу. Это позволит автоматически привязывать ответы к филиалам, чтобы потом группировать по ним результаты.
Виджет, появляющийся по клику
Виджет, появляющийся по клику – это код, при вставке которого отображается кнопка, шкала или иконка. При клике на такой виджет открывается окно с опросом.
Шкала оценок доступна только для тех случаев, когда первый вопрос в анкете— это стандартные шкалы, например, NPS-рейтинг, Звездный рейтинг, Рейтинг или Смайл-рейтинг. Шкалы для вариантов по типу NPS-рейтинга для вариантов не доступны в этой опции.
Для Текстовой кнопки и Кнопки-иконки можно настроить расположение на странице: фиксированное (т. е. в любом месте) и плавающая слева или справа. Шкала оценок имеет по умолчанию только фиксированное положение.
При добавлении виджетов опроса с фиксированным положением, они будут добавляться вниз страницы, на которой они размещены. Поэтому, если нужно разместить в другом месте, то лучше использовать код из раздела Виджет.
Для каждого виджета по клику доступны индивидуальные визуальные настройки по типу текста кнопки, шрифтов, фонов и т. п.
Опция Упрощенный вид опроса позволяет уменьшить окно с опросом (ширина 680px). В этом режиме не отображается фон опроса и прогресс-бар, а все содержание страницы опроса располагается на подложке.
Виджет, появляющийся без клика
Виджет без клика при добавлении на сайт открывается автоматически. Визуальные настройки окон с анкетой берутся из настроек дизайна самого опроса. Есть три типа визуализации такого виджета:
Page-stop: окно с анкетой открывается почти на всю ширину экрана в стандартном прохождении, поверх контента страницы.
Упрощенный Page-stop — упрощенная версия окна с анкетой; открывается поверх контента страницы в окне шириной 680 px. Опция работает точно также, как Упрощенный режим опроса.
Оба Page-stop виджета блокируют функционал страницы до тех пор, пока не будет закрыто по клику на свободное пространство или на крестик.
Hello-board позволяет открывать окно с анкетой шириной 330px поверх контента страницы, не блокируя контент. Можно выбрать расположение слева внизу или справа внизу.
Таргетирование виджета
Таргетинг — это способ выделения конкретной группы посетителей сайта, которым будет показываться виджет.
Чтобы включить настройки таргетинга, нужно активировать тумблер “Настроить таргетинг” и указать требуемые параметры. Доступно 2 типа таргетирования:
Таргетинг на пользователя
Таргетинг на действие.
Все таргетинги работают по логике И, т. е., если вы настроили таргетинг по cookie, охвату пользователей и действиям, то виджет будет показываться только тогда, когда проверка сработает в каждом из этих таргетингов.
Условия внутри таргетингов работают по логике ИЛИ (за исключением таргетинга по тегам контакта, там по логике И), т. е. таргетинг по устройству, например, по ПК и мобильным срабатывает, когда посетитель сайта зашел либо с телефона, либо с компьютера.
Таргетинги на пользователей
Таргетинг по тегу контакта позволяет настроить показ виджета тем посетителям сайта, которые заведены в FOQUZ как контакты и имеют тег. Для этого через params нужно передать значение в поле телефон, email или client_id (достаточно одного поля), по которым будет искаться контакт и проверяться условие таргетинга по тегу.
Обратите внимание, что через params передать теги нельзя. Добавить их можно либо вручную или с помощью загрузки таблицы контактов в разделе Клиенты, либо с помощью метода API.
Таргетинг на cookie позволяет настроить отображение виджета для посетителя сайта на основании названий cookie-файлов его устройства, а также их значений. В каждом условии можно выбрать конкретный оператор проверки наименования cookie и её значения:
точное соответствие – виджет отображается, если хотя бы одно наименование файлов cookie полностью совпадает с указанным значением;
включает – виджет отображается, если хотя бы одно наименование файлов cookie включает в себя указанное значение;
исключает – виджет отображается, если ни одно наименование файлов cookie не совпадает с указанным значением;
начинается с – виджет отображается, если хотя бы одно наименование файлов cookie начинается с введенного значения;
заканчивается на – виджет отображается, если хотя бы одно наименование файлов cookie заканчивается на указанное значение;
регулярное выражение – позволяет осуществлять сложный поиск наименования файлов cookie.
Тип устройства позволяет выбрать устройства, на которых этот будет показываться виджет: ПК, мобильные устройства и планшеты.
Доля пользователей позволяет установить процент охвата пользователей, передвинув бегунок до необходимого значения или указав его в соответствующем поле. Этот параметр устанавливает вероятность показа виджета, т. е., если установить 80%, то он будет показываться с вероятностью 80% каждому посетителю сайта.
Таргетинги по действиям
Опция Пользователи на конкретных страницах позволяет указать конкретные страницы и их состояния (с помощью хэшей (#) в URL), на которых необходимо показать этот виджет. В каждом условии можно выбрать какой-либо оператор проверки URL:
точное соответствие– виджет отображается, если URL полностью совпадает с указанным значением;
включает – виджет отображается, если URL включает в себя указанное значение;
исключает – виджет отображается, если в URL отсутствует указанное значение;
начинается с – виджет отображается, если URL начинается с введенного значения;
заканчивается на – виджет отображается, если URL заканчивается на введенное значение;
регулярное выражение – позволяет осуществлять сложную проверку URL.
В этом таргетинге доступны дополнительные условия, которые проверяются по логике И:
Количество переходов на страницу, после которого вызывать виджет задаёт количество переходов посетителя на любую из страниц, указанных в условиях, при достижении которого показывается виджет. Также этот счётчик переходов можно автоматически Обнулять (виджет будет показываться при каждом N-м количестве переходов) или Не обнулять (покажется только один раз в течение визита при N-м переходе на эту страницу).
Время после последнего перехода на страницу устанавливает количество секунд нахождения на странице, при достижении которого показывает виджет.
С помощью опции Учитывать хэш (#) в url можно добавить в условие для URL проверку состояния страницы (конкретное место на странице).
Триггер по событию
Триггер по событию позволяет настроить условие показа виджета по отправленному в FOQUZ сообщению о событии, в котором также можно передавать параметры контакта или анкеты аналогично Params. Вызов обработчика события происходит по методу
FQZWidget.sendEvent('eventName', {p1: 3, p3:4}),
где eventName – это наименование события, {} – объект с параметрами для события, может быть пустым.
Порядок передачи данных:
сначала инициализируется код виджета
если в объекте Params передаются параметры, то они записываются
затем вызывается событие
если в методе вызова события передаются параметры в одноименные поля, то их значения перезаписываются на те, чтобы были переданы через вызов события.
В этом случае запишутся значения в поля анкеты или клиента: price: 210, order: QER-123, order_type: online.
Доступны также дополнительные условия, которые проверяются по логике И:
Количество срабатывания события, после которого показывать виджет устанавливает количество полученных сообщений о событии, по достижению которого нужно показать виджет. Также этот счётчик переходов можно автоматически Обнулять (виджет будет показываться при каждом N-м количестве полученных событий) или Не обнулять (покажется только один раз в течение визита при N-м получении события).
Через “N” секунд после срабатывания события устанавливает количество секунд нахождения на странице, при достижении которого нужно показать виджет.
Триггер по переменным
Триггер по переменным позволяет настраивать показ виджета на основании названий полей анкеты или контакта, а также их значений. В целом триггер очень похож на таргетинг по cookie: в каждом условии так же можно выбрать конкретный оператор проверки наименования переменной и её значения:
точное соответствие: виджет отображается, если есть полное совпадение наименования и/или значения;
включает: виджет отображается, если есть совпадение с указанным фрагментом наименования и/или значения;
исключает: виджет отображается, если вообще нет совпадений;
начинается с: виджет отображается, если есть совпадение с начальным фрагментом наименования и/или значения;
заканчивается на: виджет отображается, если есть совпадение с конечным фрагментом наименования и/или значения;
регулярное выражение позволяет осуществлять сложный поиск наименования и/или значения переменной.
Настройки виджета опроса
С помощью настроек виджета можно устанавливать момент, до которого можно отображать виджет. Например, для случаев, когда нужно уменьшить количество раз, когда он видит этот виджет. Есть несколько вариантов настройки:
Кнопка/опрос показан: если виджет уже был показан, то он больше не отображается. То есть кнопки, шкалы, панели модальные окна с опросом покажутся только один раз.
Опрос показан означает, что показалось именно окно с опросом. То есть, если показались кнопка, шкала или панель, но посетитель сайта не нажал на неё, то они будут и дальше отображаться на сайте до момента, когда он все-таки нажмет на них. В случае виджетов без клика, они будут всегда единоразово показываться, аналогично с предыдущей опцией.
Респондент ответил хотя бы на один вопрос: ограничивает показ виджета, если от посетителя сайта был получен хотя бы один ответ. *Ответ считается полученным, когда респондент хотя бы один раз нажал кнопку «Далее», то есть, если в окне опроса несколько вопросов сразу, то ни один из них не сохранится пока не будет нажата кнопка «Далее», соответственно триггер не сработает.
Респондент заполнил опрос до конца позволяет отображать виджет до того момента, как респондент не окажется на конечном экране или стандартном завершении анкеты.
Показывать всегда: показывает виджет всегда:)
Код виджета
Код виджета автоматически формируется в его настройках при сохранении. Чтобы добавить виджет на сайт, этот код нужно скопировать и вставить в код сайта и/или в GTM. При изменении любых настроек, виджет на сайте обновится автоматически. Этот код виджета при совпадении условий показа открывает опрос в iframe.
Также через код виджета можно передавать какие-либо поля контакта или анкеты c помощью массива Params:
если в разделе Клиенты добавлены поля контакта, наименования которых есть в params, то передаваемые в них значения будут записываться в поля контакта;
если эти поля не добавлены, то значения будут передаваться в поля анкеты;
также с помощью параметров, передаваемых в params, можно настраивать логику отображения вопросов;
в Params можно передать значение поля lang, чтобы окно с анкетой отобразилась сразу на нужном языке, которые добавлены в настройках мультиязычности.
Пример передачи значений полей анкеты или клиента:
params: {
client_id: 000000 #значение передается в поле контакта "Внешний ID"#
"user_name": "Bender Rodriguez" #значение передается в поле контакта "ФИО"#
Email: example@mail.ru #значение передается в поле контакта контакта "Email"#
"account_id": 01010202 #если такое наименование не добавлено в полях контакта, то оно передается в поля анкеты#
}
Когда в params передаются значения полей контакта, то происходит поиск этих данных в базе контактов FOQUZ.
Если такой контакт уже есть в системе, то анкета этого респондента будет персонально привязана к нему и в результатах можно будет определить кто дал обратную связь.
Если его нет в базе, то контакт будет создан при наличии хотя бы одного из этих полей: телефон, email, client_id, фамилия и имя. Анкета также будет привязана персонально к этому респонденту.
Поиск происходит только по этим системным полям: телефон, email и client_id, по остальным полям не происходит, т. е. полученная анкета будет анонимной, если ни одно из этих трех полей не передано.
Размещение кода виджета в DOM страницы
Для ускорения загрузки страницы с виджетом, его код можно разместить прямо в DOM страницы, т. е. без использования iframe. В этом случае код виджета немного изменится, а функционал таких виджетов пока что имеет менее широкий функционал, чем тот, что размещается с помощью iframe.
Код виджета для размещения в DOM страницы
Это код (пример ниже) немного отличается от основного: в третьей строке нужно поменять значение widget_code на то, которое отображается в коде iFrame виджета (см. выше) у вас в интерфейсе, то есть вместо 8a64a39a2a1cb187bc94d1dc9e3*.
window.FOQUZ_SDK = {
widget: {
widget_code: "8a64a39a2a1cb187bc9*4d1dc9e3",
},
params: {
},
};
(function(f, o, q, u, z) {
u = o.createElement("script");
z = o.getElementsByTagName("script")[0];
u.async = 1;
u.type = "module";
u.src = q; // + "?t=" + Date.now();
z ? z.parentNode.insertBefore(u, z) : o.head.appendChild(u);
Общие особенности виджета, размещенного в DOM страницы:
доступен для визуализаций Hello-board и Упрощенный Page-stop;
в этих типах визуализаций можно вставлять картинки на фон, а также затемнять их (в обычном виджете нельзя) или настраивать цвет фона (подробнее ниже).
опции в типах вопросов Галерея фото/видео и Название вопроса не отображаются в окне опроса, размещенного в DOM;
в шкальных типах вопросов (например, Звездный рейтинг), если размещена только шкала без включенных опций комментария или уточняющего вопроса, то при клике на оценку ответ сразу сохраняется, а респондент автоматически переходит на следующий вопрос или завершение опроса;
не учитываются следующие настройки дизайна: шапка и навигация (за исключением кнопок и прогресс-бара);
также пока не реализованы: размещение нескольких вопросов на одной странице, логические переходы (но логика отображения доступна), функция наследования вариантов ответа, а также переменные с суффиксом .COPY.
Настройки дизайна DOM-виджета:
фон Hello-board берется из выставленного фона мобильного, если его нет, то берется основная картинка;
фон Упрощенного Page-stop берется из основного фона;
если фонов нет вообще, то отображается выставленный цвет фона.
Виджет, размещенный в DOM страницы поддерживает следующие типы вопросов (через двоеточие перечислены те опции, которые не отображаются в опросе, даже если включены):
Выбор вариантов: если варианты размещены плиткой, то в них не отображаются видео и увеличение при клике на изображение. Также не отображается опция варианты ответов выпадающим списком;
Стартовый экран: опции Пожаловаться, Отписаться от рассылки, Промокод с копированием и Иконки соцсетей;
Текстовый экран: опции Выбор языка и переменная Промокод с копированием (обычный промокод работает);
Конечный экран: опции Пожаловаться, Отписаться от рассылки, Иконки соцсетей, Начать заново, Отчет о тестировании и любые переменные, связанные с системой баллов (при этом сами баллы считаются и их можно посмотреть в результатах опроса;