Позвоните нам
8 800 555-23-46
звонок по Роcсии бесплатный
+7 (495) 580 30 45 Москва
+7 (8442) 73 50 76 Волгоград
+ 7 (917) 338 51 54
Все контакты и офисы
Напишите нам: info@onvolga.ru

Спросить онлайн

Что такое умный фильтр в 1С-Битрикс

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

Так, например, если мы выбираем ноутбук, мы можем выбрать количество оперативной памяти, которое нам необходимо или производителя, как на рисунке:


Пример умного фильтра на сайте «Эльдорадо»

Средство, позволяющие отфильтровать элементы по определенным характеристиками (на рисунке подчёркнуто синим, а варианты -  фиолетовым), называют умным фильтром (на рисунке выделено красным). Зелёным подчеркнут список выбранных характеристик. Рассмотрим «Умный фильтр» подробнее дальше.

Особенности умного фильтра

Основной особенностью работы умного фильтре является использование фасетных индексов для фильтрации товаров. Фасетный индекс - это индекс товара по одному свойству. Если обратиться к примеру и к рисунку №1, марка ноутбука является одним из фасетных индексов. Фасетный индекс позволяет получить элементы, подходящие по указанному свойству, исключая полный перебор товаров. Такой подход увеличивает размер базы данных, но снижает нагрузку на неё и ускоряет работу фильтра.

В Drupal`е есть похожий инструмент Facet (фасет), который позволяет строить фасетный индексы для сущностей сайта. Несмотря на аналогичный функционал и использование общей терминологии, существует значимое различие в реализации инструментов. Drupal использует для своего инструмента внешнее решение «Apache Solr», применяемое для построения и обработки фасетов, а также поиска внутри таксономии, в том числе и полнотекстового. В Bitrix`е используется решение, включённое в ядро системы. Такой подход избавляет разработчиков и пользователей от необходимости установки дополнительных программ и настройки взаимодействия между ними и системой управления контентом.

В других распространённых CMS также присутствуют плагины, которые в той или иной степени реализуют функционал умного фильтра: YITH WooCommerce Ajax Navigation (для WordPress), Custom Filters (для Joomla!, магазин virtuemart), JoomShopping Smart Filter (для Joomla!, магазин JoomShopping), Advanced Filters (для Magento). Однако, все перечисленные решения имеют один существенный недостаток - отказ от использования индексов, что увеличивает нагрузку на базу данных и снижает скорость работы. Более того все плагины (кроме YITH WooCommerce Ajax Navigation) стоят денег.

ЧПУ в умном фильтре

Начиная с версии 15.5.0 в Bitrix появилась возможность использовать человеко-понятные адреса для страниц с умным фильтром. Раньше настройки фильтра просто добавлялись параметрами в адрес страницы:

http://mysite.ru/e-store/books/business/?FILTER_P1_MIN=&FILTER_P1_MAX= &FILTER_19_1218211285=Y&FILTER_23_964515751=Y&set_filter=Показать

Данный подход имеет право на существование, но отпугивает пользователя, так как он не понимает значения этих параметров.

Но теперь мы можем помочь пользователю и сделать путь к станице наглядным отражением выбранных пользователем атрибутов в фильтре:

http://mysite.ru/e-store/books/business/filter/year-is-2002/publisher-is-эксмо/apply/

Тут сразу понятно, какого года книги мы ищем и какой издатель нас интересует.

Использование AJAX

В умном фильтре Bitrix реализовано автоматическая фильтрация товара без перезагрузки страницы, то есть обновляется только часть страницы, которая отвечает за товары. Эта возможность реализуется на основе AJAX-технологии - асинхронного запроса к серверу со страницы с целью получения новых данных. Работает это так: пользователь меняет настройки в фильтре, одновременно с ним страница посылает новые данные на сервер, который в ответ присылает новые товары, соответствующие требованиям.

Настройка умного фильтра

Основные настройки умного фильтра:

  1. Инфоблок с которым работает фильтр
  2. Шаблоны адресов страниц секции, фильтра, при использовании ЧПУ или уникальный код раздела
  3. Имя глобальной переменной с правилами фильтрации элементов раздела.

Остальные настройки умного фильтра изложены на страницах документации 1С-Битрикс (https://dev.1c-bitrix.ru/user_help/content/iblock/compo nents_2/catalog/smart_filter.php).

Пример подключения

Существует несколько способов подключения «Умного фильтра»:

  1. в составе компонента «Каталог 2.0»;
  2. используя «Визуальный редактор»;
  3. вставка вызова компонента в исходный код.

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

Также существует возможность вставить умный фильтр с помощью «Визуального редактора».

1. Для этого необходимо изменить страницу в визуальном редакторе:

2. Далее необходимо выбрать в списке компонентов «Контент», а далее - «Каталог»:

3. После чего в списке компонентов выбираем «Умный фильтр», и перенести в поле содержания страницы:

4. Теперь мы можем настроить наш «Умный фильтр»:

 

 

Особенности кастомизации

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

Свойство Способ отображения
Строка Флажки
Радиокнопки
Выпадающий список
Список Флажки
Радиокнопки
Выпадающий список
Цена/Число
Число от и до с ползунком
Число от и до
Справочник Флажки
Флажки с картинками
Флажки с картинками и названиями
Радиокнопки
Выпадающий список
Выпадающий список с названиями и картинками
Привязка к элементам Флажки
Радиокнопки
Выпадающий список 

 

 

Флажки

Число от и до

 

 

Флажки с картинками

Выпадающий список

 

Радиокнопки

Число от и до с ползунком

 

Выпадающий список с названиями и картинками

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

Так же в последних, на момент написания статьи (2017 год), версиях каталога появилась возможность выбрать форму фильтра, то есть горизонтальный или вертикальный.

Не типовое решение: умный фильтр на главной странице (не на странице каталога).

Также существует возможность использовать разные фильтры в зависимости от адреса текущей страницы. Можно использовать фильтр на странице без каталога. Но тут существует несколько ограничений:

  • на любой странице сайта не может быть больше одного фильтра;
  • имя фильтра должно быть указано в каталоге;
  • фильтр должен быть настроен на работу с каталогом.

Рассмотрим на примере, разместим первый фильтр на главной, второй будет включен в состав комплексного компонента «Каталог».

Итак у нас есть два фильтра и один каталог. Теперь остается их настроить. 

Для каталога нам понадобиться только два свойства:

  • Название фильтра;
  • Путь к фильтру при использовании ЧПУ.

В настройках фильтра все обстоит намного интереснее, нам нужно больше полей:

  • Уникальный идентификатор информационного блока;
  • Название фильтра;
  • Использование ЧПУ;
  • Типы цен;
  • Валюта;
  • Адрес фильтра ЧПУ;
  • Адрес каталога.

Теперь отфильтровать товары в каталоге можно прямо с главной страницы сайта.

 Ваш запрос или вопрос по теме:

Интернет-агентство сегодня:

ТОП20 веб-студий России по разработке интернет-магазинов по доступной цене в рейтинге CMSMagazine, 1 место в ЮФО и ТОП10 Центрального ФО.

ТОП100 веб-студий Партнеров Битрикса по созданию интернет-магазинов и 11 место среди разработчиков интернет-магазинов на Битриксе по низким ценам в рейтинге РейтингРунета-2016.

ТОП10 разработчиков интернет-магазинов Москвы по доступной цене в рейтинге РейтингРунета.

ТОП120 SEO-компаний России, специализирующихся на поисковом продвижении интернет-магазинов по версии РейтингРунета.

Золотой Сертифицированный Партнер 1С-Битрикс.

Государственная аккредитация в области информационных технологий (№5291 Министерства связи РФ).

Отзывы о веб-студии

Митрофанов Кирилл, интернет-магазин косметики, Симферополь

Благодарим Центр интернет-решений и технологий "ONVOLGA" за создание интернет-магазина!

Все работы были выполнены в срок, пожелания учтены. Был постоянный контакт с разработчиками сайта. Все вопросы решались в быстрые сроки. Исходя из своего опыта сотрудничества, рекомендуем "ONVOLGA" как надежного партнера!

Все отзывы о веб-студии

ПОЛУЧИТЕ БЕСПЛАТНУЮ КОНСУЛЬТАЦИЮ или ОТПРАВЬТЕ ЗАПРОС

Задайте вопрос о веб-разработке, обслуживании или продвижении сайта или отправьте запрос по работам. Мы стараемся отвечать на Ваши запросы в течение 24 часов.