К содержанию

msFacets: фасетный фильтр и морфологический поиск для miniShop2 и MiniShop3

Привет! Я сделал msFacets: фасетный фильтр и поиск для каталога miniShop2 на MODX 2.8 и MiniShop3 на MODX 3. Один пакет ставится на обе версии, вызов сниппета и чанки на них одинаковые.

Демо-сайт: chelnysite.ru. Тот же каталог кроссовок и курток, что на скриншотах ниже. Попробуйте фильтр и поиск, например «кросовки» с опечаткой или «адидас» русскими буквами.
Каталог с выбранными фильтрами

Зачем ещё один фильтр
На своих магазинах я упирался в три вещи. Кнопка «Назад» после AJAX-фильтра уводила покупателя со страницы каталога. Поиск без phpMorphy не понимал словоформы и опечатки. При переезде сайта на MODX 3 фильтр приходилось собирать заново. В msFacets я решил все три задачи и добавил то, что обычно докручиваешь руками: живой поиск, SEO для страниц фильтров и готовую карточку товара.

Фильтр
Каталог списком с выбранными фильтрами
  • Фасеты по производителю, разделу, полям товара, опциям, TV и полям ресурса.
  • Цену, вес и другие числовые поля покупатель задаёт ползунком или полями «от» и «до».
  • У каждого варианта стоит число товаров, после каждого выбора числа пересчитываются.
  • Выбранные фильтры видны над каталогом, каждый снимается крестиком.
  • Вид сеткой или списком, сайт запоминает выбор покупателя.
  • Каждый шаг пишется в историю браузера. Покупатель листает страницы 1, 2, 3, нажимает «Назад» и попадает на страницу 2 с теми же фильтрами.
  • Без JavaScript фильтр работает как обычная GET-форма, ссылки пагинации настоящие.
Ползунки цены и веса

Поиск
Живой поиск с подсказками
  • Словоформы, опечатки и транслит. Запрос «кросовки адидас» находит кроссовки Adidas. phpMorphy подключается, если стоит на сервере, но без него поиск тоже работает.
  • Поиск идёт по названию, артикулу, введению, описанию и тексту товара. Веса полей задаются в параметре searchFields, например «pagetitle^3, ms:article^5».
  • Синонимы ведутся таблицей на странице компонента в админке. Например, можно научить поиск находить Nike по слову «найк».
  • Четыре режима: поиск внутри каталога, отдельная страница результатов, выпадающий список, список вместе со страницей результатов. Для шапки сайта есть отдельный сниппет msFacetsSearch.
Страница в админке
Проверка поиска в админке
В разделе «Пакеты» появляется страница msFacets. Самое полезное на ней: проверка поиска. Вводишь запрос, как его набрал бы покупатель, и видишь найденные товары в порядке подсказок, их баллы и причину совпадения. Причина бывает четырёх видов: словоформа, синоним, опечатка или артикул без пробелов. Видно и то, как поиск разобрал каждое слово запроса. Если слово не понято, синоним добавляется тут же, без правки JSON.
Таблица синонимов в админке
Синонимы ведутся таблицей. Слово слева, что ещё искать справа через запятую. Кнопка «Проверить» в строке сразу запускает поиск по этому слову.
Настройки компонента в админке
Системные настройки собраны по группам: индекс и кэш, SEO, файлы оформления. Значения проверяются перед сохранением. Если меняется настройка индекса, индекс сбрасывается сам.
Состояние индекса в админке
На вкладке «Индекс» видно, где хранится индекс и сколько он занимает. Его можно собрать заранее, например после импорта, или сбросить. Пятая вкладка редактирует наборы фильтров. Страница написана без ExtJS и одинаково выглядит на MODX 2.8 и MODX 3.
SEO
  • title, H1 и description с выбранными фильтрами приходят в HTML при первой загрузке страницы. Поисковику не нужен JavaScript, чтобы их увидеть. После AJAX-обновления скрипт меняет их сам.
  • ЧПУ для фильтров, сниппет карты сайта, мост к SeoFilter на MODX 2.
  • Комбинации фильтров по умолчанию закрыты noindex, follow. Параметр noindexFiltered открывает их для индексации.
Модификации и большие каталоги
Фильтр по цене учитывает цены модификаций из msOptionsPrice2 на MODX 2 и ms3Variants на MODX 3. Индекс фильтра хранится в кэше. Если товаров больше порога (по умолчанию 8000), режим auto переносит его из кэша в файлы на диске.
На телефоне
Фильтр на телефоне
Фильтры открываются выдвижной панелью. На кнопке видно число выбранных фильтров, внизу панели стоит кнопка «Показать результаты» с количеством товаров.

Как подключить

Вызов в шаблоне каталога:
[[!msFacets?
    &parents=`5`
    &facets=`parent|title=Раздел, vendor|title=Производитель, ms:color|title=Цвет, ms:price|range|step=100|title=Цена`
    &sorts=`menuindex, pagetitle, ms:price:asc, ms:price:desc`
]]
Поиск в шапке:
[[!msFacetsSearch? &parents=`5` &searchPage=`5`]]
SEO-заголовки в шаблоне:
<title>[[!+msfacets.title]]</title>
<meta name="description" content="[[!+msfacets.description]]">
<h1 data-msf-h1>[[!+msfacets.h1]]</h1>
Карточки выводит msProducts с чанком msFacets.card, сетка и список работают сразу. Свою карточку и классы сетки темы подключают параметры tpl и rowsClass. Оформление построено на CSS-переменных.
Требования
  • MODX 2.8 с miniShop2 или MODX 3 с MiniShop3.
  • pdoTools.
  • PHP от 7.2 до 8.4. Перед выпуском пакет проходит 216 автотестов на PHP 7.2, 7.4 и 8.4.
Где взять
Компонент будет доступен на modstore.pro после модерации. Обязательно будет и документация на docs.modx.pro, ссылки на обе страницы я добавлю в эту заметку.
Вопросы, баги и пожелания пиши в комментариях.
Денис Усманов
Денис Усманов
4 часа назад
modx.pro
33
Реклама

Комментарии: 0

Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
0