Сегодня была завершена разработка нового фильтра для сайта newcom.ru. Перед тем, как начать работу над фильтром, мы изучили существующие решения — это и готовые модули для bitrix, и опыт наших коллег из других компаний.
Ни один из вариантов, который мы видели, не подошел на 100% для решения поставленной задачи.
Одной из отличительных особенностей нашего фильтра является визуальная часть:
Фильтр прикрепляется к краю экрана и ездит вместе с ним в момент прокрутки страницы. Это позволяет фильтру всегда оставаться под рукой.
Но что делать, если фильтр не помещается в экран? Для таких случаев внутри фильтра создается собственная полоса прокрутки.
Что делать, если высота рабочей области клиента настолько маленькая, что фильтром становится трудно пользоваться даже с учетом полосы прокрутки? В таких случаях наш фильтр перестает приклеиваться к экрану и становится обычным статичным HTML-элементом.
Я знаю людей, которые не любят, когда на странице что-то ездит, когда используются несколько полос прокрутки и т.д. Мы подумали и об этих людях — они всегда могут нажать на изображение кнопки и фильтр развернется и перестанет ездить.
Вторая отличительная особенность — большинству людей требуются только самые важные свойства для фильтрации, а некоторым необходим расширенный список. Чтобы не перегружать информацией первых, мы вывели только часть свойств в фильтр, но для вторых мы добавили в нижней части фильтра кнопку "Все характеристики", которая откроет полный список характеристик и вы сможете насладиться тонким подбором продукции по всем имеющимся характеристикам.
Стандартный фильтр bitrix 11 версии показывает для выбора все возможные варианты списка свойств, например свойство "источник энергии" имеет варианты "Электросеть, Аккумулятор, Бензин". Если у нас в каталоге закончились товары работающие от электросети, то необходимо скрыть данный параметр из фильтра. Мы реализовали и эту возможность, хотя это было и не очень легко в 11 версии bitrix.
И в числовых диапазонах, таких как цена, макс.давление и прочие мы реализовали удобные слайдеры для выбора диапазона, а так же настроили диапазон таким образом, чтобы пользователь мог видеть сколько стоит самый дорогой и самый дешевый товар в данном разделе.
Кроме того, для многих свойств необходимо отображать подсказки. Для этого пришлось создавать в админке новый тип свойства, чтобы в настройках каждого конкретного свойства можно было описать текст подсказки, который пользователь увидит в фильтре при клике на значок вопроса.
Административная часть фильтра.
Самое сложное — это, конечно же, управление фильтром, особенно в рамках нашей задачи, для которой не нашлось ни одного готового решения. В каждом разделе каталога должен быть свой набор свойств для фильтра: для минимоек это одни характеристики, а для пылесосов — совсем другие. В настройках каждого раздела мы создали инструмент, с помощью которого можно настраивать, какие именно свойства будут выводиться в фильтре в данном разделе. Мы учли наследования данной настройки из родительских разделов, но и это ещё не всё.
Нашей задачей было сделать собственную сортировку свойств в фильтре. То есть для минимоек, например, важным параметром является макс.давление и данное свойство в фильтре в разделе минимоек должно стоять наверху, но у пылесосов тоже есть такой параметр, как давление, однако, он не такой важный и должен стоять ниже.
Для того, чтобы реализовать поставленную задачу, нам пришлось в нашем инструменте по управлению свойствами каждого раздела создавать отдельное поле для сортировки свойств, которая будет использоваться только для определенного раздела.
