Цена — первое, по чему покупатель отсекает каталог. Он ещё не выбрал бренд и характеристики, но уже знает, сколько готов потратить. И если фильтр по цене неудобен — ползунок дёргается, диапазоны не совпадают с реальными ценами, а на телефоне вообще невозможно попасть в нужную сумму — человек уходит, так и не дойдя до товара.
В этой статье разберём три подхода к фильтру по цене на 1С-Битрикс — слайдер, готовые диапазоны и ручной ввод «от» и «до», — покажем, как они устроены под капотом умного фильтра catalog.smart.filter, и что делать с производительностью и ценами по группам клиентов. Если каталог уже большой и «тяжёлый», часть проблем решается на уровне данных и инфраструктуры — тут поможет аудит и оптимизация 1С.
Коротко
- Слайдер удобен для прикидки, ручной ввод — для точного бюджета, пресеты — для быстрых ссылок и мобильных.
- Лучший вариант почти всегда комбинированный: двойной слайдер плюс связанные поля «от» и «до».
- Скорость фильтра держится на фасетном индексе умного фильтра — без него каждый запрос перебирает весь каталог.
- В B2B фильтр должен считать диапазоны по цене группы клиента и учитывать скидки, иначе выдача не совпадёт с витриной.
Почему фильтр по цене важнее, чем кажется
Цена — самый универсальный критерий выбора. По бренду фильтруют не все, по характеристикам — только те, кто разбирается, а по цене отсекает почти каждый. Поэтому ценовой фильтр открывают чаще любого другого, и его удобство напрямую влияет на глубину просмотра каталога и конверсию.
Ошибки здесь дорого стоят. Если ползунок показывает диапазон 0–2 000 000 из-за одной аномальной позиции, реальные товары за 500–3000 рублей сжаты в невидимую точку слева, и пользоваться слайдером невозможно. Если пресеты не совпадают с ассортиментом, клик по «до 1000» даёт пустую страницу. Каждая такая мелочь — потерянный клиент, который просто закрыл вкладку.
Как умный фильтр Битрикса работает с ценой
В 1С-Битрикс цена — не обычное свойство инфоблока, а сущность торгового каталога: у товара может быть несколько типов цен (базовая, оптовая, розничная), привязанных к группам покупателей. Компонент умного фильтра catalog.smart.filter умеет выводить цену как поле фильтра и по умолчанию отдаёт под неё слайдер с двумя границами.
Границы слайдера фильтр берёт из минимальной и максимальной цены в выборке, а количество подходящих товаров считает по фасетному индексу. Ключевой момент — какой тип цены участвует в фильтре. Если на витрине показывается один тип цены, а фильтр настроен на другой, диапазоны и выдача разойдутся. Поэтому первый шаг — договориться, какая цена «главная» для фильтра, и настроить компонент под неё.
Слайдер диапазона: где он хорош
Двойной слайдер (два ползунка «от» и «до» на одной шкале) — самый наглядный способ задать диапазон. Пользователь видит границы цен в категории и быстро сужает их движением руки, не набирая цифры.
- Плюс: мгновенная прикидка «сколько вообще стоят такие товары» без ввода.
- Плюс: показывает реальный разброс цен — сразу видно, где самый плотный сегмент.
- Минус: сложно попасть в точную сумму, особенно если шкала широкая или нелинейная.
- Минус: на телефоне ползунок капризен — палец перекрывает значение, легко промахнуться.
Слайдер хорош, когда разброс цен в категории умеренный и покупатель ещё не определился с бюджетом. Но полагаться только на него — ошибка: тем, кто знает точную сумму, нужен ввод.
Готовые ценовые диапазоны и пресеты
Пресеты — это заранее заданные диапазоны в виде ссылок или чекбоксов: «до 1000 ₽», «1000–5000 ₽», «5000–15000 ₽», «дороже 15000 ₽». Они не заменяют слайдер, но закрывают отдельные сценарии.
- Скорость: один клик вместо возни с ползунком — особенно ценно на мобильных.
- SEO: под частотный диапазон можно сделать отдельную посадочную страницу с ЧПУ и метатегами.
- Аналитика: по кликам видно, какие ценовые сегменты интересны аудитории.
Главное — задавать границы пресетов по реальному распределению цен в категории, а не «от балды». Пустой пресет хуже его отсутствия. Разумно генерировать диапазоны из статистики каталога и обновлять их при существенном изменении цен.
Ручной ввод «от» и «до»
Числовые поля «от» и «до» нужны тем, у кого бюджет уже в голове: «хочу до 3000, но не дешевле 1500». Это самый точный способ, и в B2B он часто важнее слайдера — закупщик работает с конкретными суммами, а не «на глаз».
Чтобы ручной ввод не раздражал, важно предусмотреть детали: подставлять реальные min/max как плейсхолдеры, не сбрасывать введённое при перерисовке, корректно обрабатывать случай, когда «от» больше «до», и применять фильтр по кнопке или с задержкой, а не на каждое нажатие клавиши.
Комбинированный вариант и как выбрать
На практике лучший фильтр по цене — не «или-или», а сочетание. Двойной слайдер даёт наглядность, связанные с ним поля «от» и «до» — точность, а несколько пресетов сверху ускоряют типовые сценарии. Всё это управляет одним и тем же диапазоном: подвинул ползунок — обновились поля, ввёл сумму — сдвинулся ползунок.
| Способ | Сильная сторона | Когда выбирать |
|---|---|---|
| Слайдер | Наглядность, прикидка | Умеренный разброс цен, розница |
| Пресеты | Скорость, SEO, мобильные | Понятные ценовые сегменты |
| Ручной ввод | Точность бюджета | B2B, дорогой ассортимент |
| Комбинация | Всё сразу | Почти всегда |
Если разброс цен огромный (от сотен до миллионов), рассмотрите логарифмическую шкалу слайдера или обязательные пресеты — линейный ползунок на таком диапазоне бесполезен.
Фасетный индекс и производительность
Умный фильтр Битрикса быстр благодаря фасетному индексу — заранее подготовленной таблице соответствий «значение фильтра → товары». Без него каждый запрос заново перебирает каталог, считает диапазоны и количество, и на десятках тысяч товаров фильтр начинает ощутимо тормозить.
- Включите фасетный индекс для инфоблока каталога и убедитесь, что он построен.
- Пересчитывайте индекс после массовых изменений цен и обмена с 1С — иначе диапазоны устаревают.
- Кэшируйте выдачу фильтра и каталога, чтобы популярные комбинации не считались каждый раз.
- Следите за агентами и очередью пересчёта индекса, чтобы он не отставал от реальных данных.
При очень больших каталогах тяжёлые выборки полезно строить на D7-ORM с продуманными запросами, а нагрузку — распределять на уровне инфраструктуры. Про правильную серверную основу для тяжёлого Битрикса мы писали в материале про хостинг и BitrixVM.
Цены по группам клиентов в B2B
В B2B цена зависит от того, кто смотрит: у дилера, опта и розничного гостя — разные типы цен. Если фильтр считает диапазоны по базовой цене, а дилер видит дилерскую, он задаст «до 5000» по своим ценам и получит пустую или неверную выдачу.
Правильно — привязать типы цен к группам пользователей и настроить фильтр так, чтобы он оперировал ценой, которую реально видит авторизованный клиент. Это требует аккуратной работы с торговым каталогом и, как правило, кастомизации логики фильтра под группы. Такие доработки — часть автоматизации на 1С, где цены, скидки и обмен настраиваются под реальные бизнес-правила.
Скидки, валюта и цена со скидкой
Отдельная ловушка — скидки. Если на витрине показывается цена со скидкой, а фильтр считает по базовой, покупатель поставит «до 1000», а увидит товар за 900 со скидкой, которого «по фильтру не должно быть», — или наоборот. Расхождение подрывает доверие.
Варианты решения: фильтровать по тому же типу цены и правилам скидок, что и на витрине, либо хранить итоговую цену (со скидкой) в отдельном индексируемом свойстве и строить фильтр по нему. Для мультивалютных каталогов границы приводят к базовой валюте и конвертируют на лету, чтобы сравнение было корректным.
Мобильный UX ценового фильтра
Больше половины трафика — мобильный, а слайдер на телефоне самый капризный элемент фильтра. Несколько правил делают его удобным:
- Крупные зоны захвата у ползунков — палец не должен промахиваться.
- Числовые поля рядом со слайдером с клавиатурой цифр (
inputmode="numeric"). - Пресеты первым экраном — на мобильном по ним попадают быстрее, чем двигают ползунок.
- Применение по кнопке, а не на каждое касание, чтобы не перегружать сеть и не дёргать выдачу.
Частые ошибки
- Границы слайдера по всему каталогу. Аномальная дорогая позиция растягивает шкалу, и реальные цены сжаты в точку.
- Фильтр без фасетного индекса. Каждый запрос перебирает каталог — на объёме всё тормозит.
- Разные типы цен в фильтре и на витрине. Диапазоны не совпадают с реальными ценами товаров.
- Пустые пресеты. Диапазоны заданы «от балды» и ведут на пустую выдачу.
- Нет учёта скидок. Фильтр по базовой цене, а витрина со скидкой — покупатель видит противоречие.
- Только слайдер. Тем, кто знает точную сумму, негде её ввести.
- Индекс не пересчитан после обмена. Цены обновились в 1С, а фильтр показывает старые границы.
Чек-лист внедрения
- Определите главную цену фильтра. Один тип цены для фильтра и витрины, с одинаковыми скидками.
- Соберите комбинированный фильтр. Двойной слайдер плюс связанные поля «от» и «до».
- Добавьте пресеты по данным. Диапазоны из реального распределения цен, без пустых.
- Включите фасетный индекс. Постройте его и настройте пересчёт после обмена с 1С.
- Настройте цены по группам. В B2B фильтр считает по цене авторизованного клиента.
- Проверьте мобильный UX. Крупные ползунки, цифровая клавиатура, применение по кнопке.
- Прогоните на боевых данных. Реальные цены, скидки, группы, граничные случаи «от больше до».
Вывод
Спор «слайдер против ручного ввода» решается просто: нужны оба, и лучше вместе с пресетами. Слайдер даёт наглядность, поля — точность, пресеты — скорость и SEO. Технически всё держится на умном фильтре с фасетным индексом и на честной работе с типами цен и скидками — особенно в B2B, где цена зависит от группы клиента.
Сделайте фильтр по цене корректным и быстрым — и покупатель дойдёт от «сколько это стоит» до корзины без раздражения. А если каталог большой и цены приходят из 1С, начните с порядка в данных и обмене: на кривых ценах ни один фильтр не будет работать хорошо.