SearchBooster.io

Вопросы и ответы

Вопрос:
Как работать с синонимами?
Ответ:
Список синонимов можно добавить в панели управления на странице редактирования проекта.
Слова и синоним между собой разделяются запятыми, а сами синонимы между собой разделяются красной строкой.

Пример:
телефон,смартфон
телефон,мобильник
телефон,мобильный

Правила формирования синонимов
Допустимые конструкции для работы с синонимами:
  • Одно слово,одно слово
  • Одно слово,много слов
Пример одно слово,одно слово:
телефон,смартфон

Пример одно слово,много слов:
смартфон,мобильный телефон

Важен порядок
Связка синонимов работает в одну сторону.
Пример:
Пила,бензопила

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

Размер букв значения не имеет.
Вопрос:
Как можно изменить формат отображения товаров в поисковой выдаче?
Ответ:
Созданы Vue.js шаблоны на уровне отображения карточки товара.
Можно создать свой шаблон на уровне каждой категории и переопределять стили CSS.
Вопрос:
Какая скорость ответа на запрос?
Ответ:
Средняя скорость ответа на запрос меньше 100 мс.
Вопрос:
Как установить код?
Ответ:
Есть несколько способов установить код:
  1. непосредственно в HTML код страницы
  2. через Google Tag Manager
Вопрос:
Какие товары увидит пользователь после ввода поискового запроса?
Ответ:
В результаты поисковой выдачи попадают все товары, которые были переданы при помощи YML файла, который был вами указать в настройках проекта в панели управления.

Также после загрузки фида можно поставить галочку напротив пункта "Учитывать наличие". В этом случае пользователь увидит только те товары, которые находятся в наличии на основе соответствующего тега из YML фида.
Вопрос:
Как изменить оформления модуля поиска, например цвет ссылок и шрифт?
Ответ:
CSS customization
  • все классы начинаются с l-ss-c-*
  • все стили страницы описанные как
<style class="l-ss-styles">
.l-ss-c-search-input {
border: 1px dashed #000;
}
</style>
будут скопированы внутрь элементов

  • все хост обертки элементов имеют классы
l-ss-c-host-wrapper
l-ss-c-host-wrapper-is-[type] -> l-ss-c-host-wrapper-is-search-input

l-ss-c-is-mobile - detected mobile device

l-ss-c-is-phone-only-small

l-ss-c-is-phone-only-small - screen size >= 100px
l-ss-c-is-phone-only - screen size >= 599px
l-ss-c-is-tablet-portrait-up - screen size >= 600px
l-ss-c-is-tablet-landscape-up - screen size >= 900px
l-ss-c-is-desktop-up - screen size >= 1200px
l-ss-c-is-big-desktop-up - screen size >= 1800px

l-ss-c-host-wrapper-is-ready

  • все root элементы внутри кастом элемента могут иметь классы
l-ss-c-[name], ex. l-ss-c-search-popup

l-ss-c-is-not-responsive - нет мета тега
l-ss-c-is-mobile - detected mobile device

l-ss-c-is-phone-only-small - screen size >= 100px
l-ss-c-is-phone-only - screen size >= 599px
l-ss-c-is-tablet-portrait-up - screen size >= 600px
l-ss-c-is-tablet-landscape-up - screen size >= 900px
l-ss-c-is-desktop-up - screen size >= 1200px
l-ss-c-is-big-desktop-up - screen size >= 1800px
Пример кода для установки на сайт
Код можно поставить через Google Tag Manager в произвольный тех HTML.
<div>
    <div id="search-node" class="input-lg"></div>
</div>

<script>
    (function (e, t, n, o, c) {
        e[c] = e[c] || function () {
            (e[c].a = e[c].a || []).push(arguments);
        }, e[c].h = o, e[c].n = c, e[c].i = 1 * new Date, s = t.createElement(n), a = t.getElementsByTagName(n)[0], s.async = 1, s.src = o, a.parentNode.insertBefore(s, a);
    })(window, document, 'script', 'https://cdn.searchbooster.io/v1/init.js', 'searchbooster');

    searchbooster({
        theme: 'base',
        apiUrl: '//api2.searchbooster.io',
        popup: {
            search: true
        },
        apiKey: 'QWERTY-QWERTY-000-000-qwerty123456', #уникальный ключ активации сервиса
        initialized: function(SearchBooster) {
            SearchBooster.CombinedSearchInput.mount('#search-node'); #search-node это id элемента на странице, к которому подключаем поиск
        },
    });
</script>

<div id="search-node" class="input-lg"></div> #div на вашем сайте, который представляет поле для поиска