Работа с виджетом поиска в Searchbooster.io

Иван Барченков
Автор: Иван Барченков

Образование: Мастер делового администрирования - Master of Bussines Administration (MBA) по специальности Инновационно-инвестиционный менеджмент.

Опыт работы: лет

Краткая биография:

Рекламные кампании Ивана опубликованы в библиотеках лучших кейсов Google и Яндекс. Имеет опыт преподавания интернет-маркетинга в МГИМО, Moscow business school, BrainWashing, РАГС, ВШЭ, МИСиС, IHSBM. Обладатель степени MBA. Сертифицированный специалист Яндекс.Директ, Google Ads, Яндекс.Метрика, Google Analytics, К50: Генератор, Youtube, DBM. Спикер РИФ+КИБ, Оборот.ру, СПИК, MIXX.

В портфолио эксперта увеличение прибыли Gett, ЛитРес, Амедиатека, Hansa и других проектов. Владеет несколькими собственными e-commerce проектами. Является сертифицированным партнером по обучению Яндекс.

Работа с виджетом поиска в Searchbooster.io

Чтобы пользователь вашего интернет-магазина смог легко и быстро найти нужный ему товар, лучше отказаться от стандартного модуля поиска, идущего в комплекте с CMS. Его возможности ограничены. Да, если посетитель введет название продукта, перед ним выпадут все совпадающие запросу варианты. Но их может оказаться тысячи. Поэтому и создана платформа Searchbooster.io: она дает необходимые инструменты для того, чтобы в этих тысячах похожих товаров клиент за несколько секунд отыскал нужный.
Настраивается виджет «умного» поиска в настройках личного аккаунта на платформе.

Раздел «Виджеты»

В левом боковом меню учетной записи Searchbooster.io есть пункт «Виджеты». Здесь и настраиваются дизайн и функциональность поискового виджета для вашего сайта.

Раздел «Виджеты»Раздел «Конфигурация»

В нем три подраздела, в которых нужно последовательно ввести свои коррективы:

  • «Цвета темы»;
  • «Настройка событий»;
  • «Дополнительные опции».

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

Раздел «Конфигурация»

Второй подраздел — «Настройка событий». Состоит из 4 полей. В каждое поле нужно добавить определенный код:

Настройка событий

  1. Событие добавления товара в корзину. Сюда вставляется фрагмент кода, с помощью которого товар в корзину клиенту можно будет добавлять сразу из поиска.
  2. Событие открытия окна поиска. В этом поле прописывается код, который сформирует и отобразит на сайте содержимое окна поиска при его открытии.
  3. Событие поиска. Вставляется код функции, которая выводит совпадающие результаты по мере ввода текста поискового запроса. Или код другой функции в зависимости от решаемой задачи.
  4. Событие подсказок. Код, выводящий подсказки по товарам, которые ищет клиент, прямо в окне формы.

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

Раздел «Виджеты»

Можно настроить четыре типа виджетов, они представлены в отдельных вкладках.

Поиск классический

Поиск классический

Обладает несколькими настройками. В поле «Селектор» вводится системный тег, например, #search-popup (для отображения в отдельном окне).

Поисковый лимит

Указывается количество вводимых в поисковом запросе символов.

Лимит символов в описании

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

Расположение меню

Выбирается расположение меню в виджете: сверху, снизу.

Включить подсказки

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

Поиск по картинкам

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

Показывать корзину

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

Голосовой ввод

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

Группировка категорий в виджете

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

Показывать каталог

При включении опции в виджете будет отображаться каталог товаров.

Отображать в попапе

Это новая функция. Если включить ее, виджет поиска будет отображаться в попапе. Если оставить неактивной — поиск будет встроен в страницу сайта.

Виджет подборки товаров

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

Виджет подборки товаров

Селектор

Здесь вводится определенный тег, например, #offers, который будет открывать данную подборку товаров.

Селектор

Тип отображения

Их два — слайдер и сетка. При выборе первого, товары в выдаче будут представляться в виде листаемого слайдера. Во втором случае — в виде таблицы.

Тип запроса

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

При выборе настроек появляется дополнительное поле «Определение offerid». Введенный сюда код позволит отбирать товары для отображения в виджете по идентификатору оффера из фида.

Также можно настроить текстовое поле «Параметры запроса», введя в него определенный код. Например, код {«query»: «велосипед» , «skip»: 0, «limit»:24} будет выводить по запросу «велосипеды» соответствующий товар по 24 штуки на страницу.

Не забываем про кнопку «Применить настройки».

Виджет поисковых подсказок

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

Здесь также в поле «Селектор» вводится определенный тег и прописываются события:

  • Событие клика.
  • Событие нажатия на Enter.
  • Событие раскрытия.
  • Событие закрытия.

Виджет поисковых подсказок

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

Виджет поисковых подсказок 2

Кликнув по любому варианту, посетитель интернет-магазина перейдет на страницу с этим товаром.

Виджет результатов поиска

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

Виджет результатов поиска

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

Результат

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

Добавить комментарий