Фильтры с бегунком

Словарь

Фильтр товаров в каталоге – опция, позволяющая отфильтровать группу товаров по заданным характеристикам.

Фильтр с ползунком – новый вид фильтра, который позволяет выбирать значения для фильтрации товаров на линейке значений с помощью ползунка.

Назначение

Фильтр с ползунком позволяет удобно выбрать нужные значения для фильтрации товаров/услуг каталога.

Работа с фильтром

Пройдем в каталог и через меню редактирования каталога пройдем по ссылке «Характеристики» (Рисунок 1). Подробно про создание и редактирование характеристик смотрите в инструкции «Фильтр в каталоге (+видео)» и «Характеристики товаров (+видео)».

Рисунок 1 — Каталог. Меню редактирования каталога. Характеристики

Отредактируем уже ранее созданные характеристики и зададим им различные стили фильтров с ползунком. Сейчас нам доступны следующие стили:

  • Ползунок – при данном фильтре мы сможем выбрать значение либо из выпадающего списка, либо, перемещая ползунок по линейке значений данной характеристики (в данном случае выбранные значения будут автоматически появляться в поле выпадающего списка);
  • Ползунок с видимым диапазоном — при данном фильтре мы сможем выбрать значение либо из выпадающего списка, либо, перемещая ползунок по линейке значений данной характеристики (в данном случае выбранные значения будут автоматически появляться в поле выпадающего списка). В данном случае, фильтрация будет происходить от начального значения до выбранного пользователем;
  • Ползунок с выбором диапазона — при данном фильтре мы сможем выбрать диапазон значений либо из выпадающего списка, либо, перемещая ползунки по линейке значений данной характеристики (в данном случае выбранные значения будут автоматически появляться в поле выпадающего списка). В данном случае, фильтрация будет происходить от левого значения до правого значения характеристики, которые выбрал пользователь;

Для характеристики Длина выберем стиль «Ползунок» (Рисунок 2).

Настройка характеристики. Стиль фильтра "Ползунок"

Рисунок 2 — Настройка характеристики. Стиль фильтра «Ползунок»

Для характеристики Высота — стиль «Ползунок с видимым диапазоном» (Рисунок 3).

Настройка характеристики. Стиль фильтра «Ползунок с видимым диапазоном»

Рисунок 3 — Настройка характеристики. Стиль фильтра «Ползунок с видимым диапазоном» 

Для характеристики «Цвет» — стиль «Ползунок с выбором диапазона» (Рисунок 4).

Настройка характеристики. Стиль фильтра «Ползунок с выбором диапазона»

Рисунок 4 — Настройка характеристики. Стиль фильтра «Ползунок с выбором диапазона»

Далее пройдем в каталог. У нас уже есть значения характеристик, которые прикреплены к товарам. Это можно сделать через меню редактирования товара при его просмотре, пройдя по ссылке «Характеристики». Подробнее про прикрепление значений характеристик к отдельным товарам можно узнать в инструкции «Фильтр в каталоге (+видео)» и «Характеристики товаров (+видео)»..

В каталоге фильтры с ползунками стали доступны, попробуем выбрать значения и отфильтровать (Рисунок 5).

Рисунок 5 — Каталог. Выбор значений для фильтрации

Как мы видим, в результате фильтрации появились товары, удовлетворяющие выбранным значениям (Рисунок 6).

Рисунок 6 — Результат фильтрации

Для отмены результатов фильтрации надо нажать на кнопку «Очистить фильтр».

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

Варианты использования

Новый вид фильтра с ползунком полезно использовать:

  • При размещении фильтров, у которых большоеколичество значений. Пользователю будет удобнее выбрать ползунком по линейке нужную высоту, например, чем искать ее в длиннющем выпадающем списке;
  • Для украшения и разнообразия сайта.
Вернуться к разделу