Фильтры каталога товаров в виде ползунков "от-до" в Тильде
Продолжаем модифицировать каталог Тильды. На этот раз преобразил фильтры.
Код высчитывает min и max значения каждой величины и формирует диапазон.
Фильтр в виде ползунков работает со всеми блоками каталога товаров: ST300, ST305N, ST310N, ST315N, ST320N, ST330.
Код высчитывает min и max значения каждой величины и формирует диапазон.
Фильтр в виде ползунков работает со всеми блоками каталога товаров: ST300, ST305N, ST310N, ST315N, ST320N, ST330.
Тут можно получить доступ к модификации и самостоятельно установить
Установка занимает до 5 минут и не требует специальных навыков.
Инструкцию вы получите вместе с кодом.
Инструкцию вы получите вместе с кодом.
Функционал новых фильтров:
Ползунки “от–до” вместо стандартного списка чекбоксов.
Пример: Длина, Ширина, Высота и Объём выводятся в виде ползунков "от-до", каждый с собственным масштабируемым диапазоном.
Ручной ввод поля «от» и «до» над ползунком можно заполнять вручную — слайдер подтягивается под цифры и применяет фильтрацию.
Сохранение фильтрации в URL
Ссылки с активными фильтрами открываются на тех диапазонах, что были выставлены при копировании ссылки (удобно делиться выборкой).
Адаптивный дизайн
Фильтры адаптированы для всех устройств и используют автоскейл.
Ключевые возможности:
Ползунки “от–до” вместо стандартного списка чекбоксов.
Пример: Длина, Ширина, Высота и Объём выводятся в виде ползунков "от-до", каждый с собственным масштабируемым диапазоном.
Ручной ввод поля «от» и «до» над ползунком можно заполнять вручную — слайдер подтягивается под цифры и применяет фильтрацию.
Сохранение фильтрации в URL
Ссылки с активными фильтрами открываются на тех диапазонах, что были выставлены при копировании ссылки (удобно делиться выборкой).
Адаптивный дизайн
Фильтры адаптированы для всех устройств и используют автоскейл.
Ключевые возможности:
- При загрузке страницы минимальный и максимальный пределы всех фильтров вычисляются автоматически по фактическим значениям характеристик (например, Ширина от 40 до 80 мм). Так что если добавить новое значение больше текущего максимального, то будет пересчет фильтра и выставлен новый диапазон.
- Если пользователь возвращает ползунок в исходное положение (от = min, до = max), соответствующий фильтр автоматически сбрасывается. Остальные активные фильтры остаются нетронутыми.