Фильтр товаров в WooCommerce: как сделать удобный подбор

Коротко

В WooCommerce фильтры товаров строятся на атрибутах: цвет, размер, материал, бренд заводятся как глобальные атрибуты, а фильтр показывает их значения и отбирает товары. Базовые фильтры по атрибутам, цене, наличию и рейтингу есть в самом WooCommerce в виде блоков и виджетов. Если нужен AJAX без перезагрузки, фильтр по произвольным полям, SEO-страницы для популярных сочетаний или удобная мобильная версия — подключают специализированный плагин фильтрации.

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

Задача	Встроенные средства WooCommerce	Плагин фильтрации
Фильтр по атрибутам	Есть	Есть, больше вариантов отображения
Фильтр по цене	Есть	Есть
Фильтр по наличию и рейтингу	Есть в блоках	Есть
Фильтр без перезагрузки страницы	Зависит от темы и блоков	Обычно есть
Фильтр по произвольным полям	Нет	Есть у многих
SEO-страницы с чистыми адресами	Нет	Есть у некоторых
Счётчики товаров у значений	Частично	Обычно есть

Основная мысль

Хороший фильтр начинается не с плагина, а с данных: если атрибуты заведены хаотично — «красный», «Красный», «красн.» и отдельный атрибут на каждую категорию, — никакой плагин не сделает подбор удобным.

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

Второй слой — техника: скорость, AJAX, мобильная версия. Третий — SEO: какие страницы фильтра индексировать, а какие закрыть. Ниже разберу все три слоя по порядку.

Как устроены фильтры товара в WooCommerce

Прежде чем выбирать плагин, стоит понять, на чём фильтры работают внутри WooCommerce. Это объясняет большинство проблем, которые возникают потом.

Глобальные и локальные атрибуты

В WooCommerce есть два вида атрибутов. Глобальные создаются в разделе «Товары» → «Атрибуты» и имеют общий список значений для всего магазина. Локальные (пользовательские) задаются прямо в карточке товара и существуют только в ней.

Встроенные фильтры работают только с глобальными атрибутами. Если цвет у товаров заведён как пользовательский атрибут в каждой карточке, встроенный фильтр его не увидит. Это самая частая причина, по которой «фильтр не работает».

Атрибуты и вариации

Атрибуты используются и для вариаций: например, футболка одного фасона в пяти размерах и трёх цветах. Фильтр по атрибуту находит вариативный товар, если у него есть подходящая вариация. Подробнее о карточке, вариациях и импорте — в статье про товары в WooCommerce.

Категории, метки и цена

Кроме атрибутов, фильтровать можно по категориям, меткам, цене, наличию и рейтингу. Категории лучше использовать для структуры каталога, а не для фильтрации: «Кроссовки» — это категория, а «Размер 42» — атрибут.

Параметры в адресе

При фильтрации WooCommerce добавляет параметры к адресу страницы, например filter_color=red или min_price и max_price. Каждое сочетание параметров даёт новый адрес. Отсюда вопросы индексации, о которых ниже.

Как подготовить атрибуты для фильтра

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

Соберите список характеристик. Для каждой категории выпишите, по каким параметрам покупатели реально выбирают товар. Обычно это 5–8 характеристик, а не всё, что есть в карточке поставщика.
Объедините одинаковые характеристики. «Цвет» — один атрибут на весь магазин, а не отдельный для каждой категории.
Нормализуйте значения. Выберите одно написание: «Хлопок», а не «хлопок», «Хлопок 100%» и «Х/Б». Числовые значения приведите к одним единицам.
Создайте глобальные атрибуты в разделе «Товары» → «Атрибуты» и заполните списки значений.
Разметьте товары. Для небольшого каталога — вручную, для большого — массово через импорт CSV. Во встроенном импортёре WooCommerce у каждого атрибута есть колонки с названием, значениями, видимостью и признаком глобального атрибута.
Проверьте покрытие. Отберите товары категории без значения нужного атрибута: они не появятся в результатах фильтра.

Сценарий: магазин одежды

В магазине одежды характеристики пришли от трёх поставщиков. Один пишет размер как «M», второй — «46», третий — «46-48». Если завести всё как есть, фильтр по размеру превратится в список из сорока значений.

Решение — договориться о шкале размеров, сопоставить значения поставщиков с ней и при импорте подставлять нормализованное значение. Дополнительно можно хранить исходный размер поставщика в описании товара. Покупатель выбирает понятное значение и видит все подходящие товары.

Встроенные фильтры WooCommerce

Для небольшого магазина встроенных средств часто достаточно. Как именно они подключаются, зависит от темы.

Блоки фильтров

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

Классические виджеты

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

Пошаговая настройка встроенного фильтра

Создайте глобальный атрибут в разделе «Товары» → «Атрибуты», например «Цвет».
Добавьте значения атрибута: «Белый», «Чёрный», «Красный».
В карточках товаров во вкладке атрибутов выберите глобальный атрибут и отметьте значения.
Откройте шаблон архива товаров в редакторе сайта или раздел виджетов и добавьте фильтр по атрибуту «Цвет».
Выберите режим: «И» (товар должен подходить под все выбранные значения) или «ИЛИ» (под любое из них).
Проверьте фильтр на странице категории, в том числе на телефоне.

Ограничения встроенных средств

Нет фильтра по произвольным полям товара.
Мало вариантов отображения: цветовые плашки, диапазоны, выпадающие списки зависят от темы.
Нет SEO-страниц с чистыми адресами.
Поведение на мобильных зависит от темы.

WooCommerce filter: какой плагин выбрать

Плагинов фильтрации много, в каталоге WordPress их ищут по запросу «WooCommerce filter». Среди популярных — YITH WooCommerce Ajax Product Filter, Filter Everything, HUSKY (бывший WOOF), JetSmartFilters для сайтов на Elementor. Возможности бесплатных и платных версий отличаются, поэтому актуальный список функций и цены смотрите на сайтах разработчиков.

На что смотреть при выборе

Критерий	Почему важен
Работа с глобальными атрибутами и таксономиями	Основа быстрой фильтрации
Фильтр по произвольным полям	Нужен, если характеристики хранятся в метаполях
AJAX и обновление адреса	Удобство и возможность поделиться ссылкой
SEO-правила и чистые адреса	Посадочные страницы для популярных сочетаний
Скорость на большом каталоге	Кэш счётчиков, индексы, нагрузка на базу
Совместимость с темой	Вёрстка фильтра, мобильная версия
Регулярные обновления	Совместимость с новыми версиями WooCommerce

Как тестировать плагин

Разверните копию сайта на тестовом поддомене.
Установите плагин и настройте фильтры на одной большой категории.
Замерьте время ответа страницы категории до и после.
Проверьте мобильную версию и работу кнопок «Сбросить» и «Показать».
Посмотрите, какие адреса формирует фильтр и можно ли управлять их индексацией.

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

Фильтр по цене, наличию и характеристикам

Некоторые фильтры встречаются почти в каждом магазине. У каждого свои тонкости.

Фильтр по цене

Фильтр по цене работает по фактической цене товара, включая цену со скидкой. Если цены в магазине часто меняются или выгружаются из 1С, проверьте, что после обновления цен фильтр показывает правильный диапазон. В магазинах с оптовыми ценами для разных групп покупателей фильтр по цене требует отдельной проработки.

Фильтр по наличию

Покупателю важно видеть товары в наличии. Есть два подхода: скрыть отсутствующие товары в настройках WooCommerce или дать фильтр «Только в наличии». Второй вариант гибче: товары «под заказ» остаются в каталоге и в поиске, а покупатель сам решает, показывать ли их.

Характеристики из 1С

Если каталог выгружается из 1С, характеристики обычно приходят как свойства номенклатуры. Как они станут атрибутами WooCommerce — глобальными или локальными, — зависит от модуля обмена. Это нужно проверить до запуска фильтров. Про настройку обмена — в статье про обмен WordPress и WooCommerce с 1С.

Сценарий: магазин сантехники

В каталоге смесители, раковины, ванны. У каждой категории свои характеристики: у смесителей — тип монтажа и материал, у ванн — размеры и форма. Фильтр в каждой категории показывает только её характеристики, а не общий список из тридцати атрибутов. Большинство плагинов позволяют привязать набор фильтров к категории.

Скорость фильтра на большом каталоге

На каталоге из нескольких тысяч товаров фильтр становится одной из самых тяжёлых частей магазина. Каждый клик — это запрос к базе с несколькими условиями.

Почему фильтр тормозит

Фильтрация по метаполям вместо таксономий: такие запросы к базе работают медленнее.
Пересчёт количества товаров для каждого значения при каждом запросе.
Много атрибутов с сотнями значений.
Слабый хостинг и отсутствие объектного кэша.

Что помогает

Хранить характеристики, по которым фильтруют, в глобальных атрибутах, а не в метаполях.
Включить в расширенных настройках товаров WooCommerce использование таблицы атрибутов для фильтрации, если она доступна в вашей версии.
Подключить объектный кэш, например Redis, если хостинг его поддерживает.
Ограничить набор фильтров в каждой категории нужными характеристиками.
Использовать плагин, который кэширует счётчики товаров.

Ориентиры скорости те же, что для всего сайта: LCP ≤ 2,5 с, INP ≤ 200 мс, CLS ≤ 0,1. Фильтр с долгой реакцией на клик ухудшает INP. Если каталог уже тормозит, начните с аудита, а не с замены плагина: иногда причина вовсе не в фильтре. С этим помогает ускорение сайта.

Как проверить скорость фильтра

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

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

Фильтры и SEO: что индексировать

Каждое сочетание значений фильтра создаёт новый адрес. Если их не контролировать, поисковик находит тысячи почти одинаковых страниц.

Проблема дублей

Страница «Кроссовки» с фильтром «чёрные, 42 размер, в наличии» почти совпадает со страницей «Кроссовки, чёрные, 42 размер». Для поисковика это дубли и мусорные страницы, которые тратят ресурсы робота. Как находить такие страницы, разобрано в статье о дублях страниц на сайте.

Что закрывать

Страницы с параметрами фильтра по умолчанию закрывают от индексации: мета-тегом robots noindex или canonical на основную категорию. Подробнее о canonical — в статье про тег canonical.
Для Яндекса дополнительно указывают директиву Clean-param в robots.txt, чтобы робот не обходил адреса с параметрами фильтра.
Сортировку и количество товаров на странице тоже не индексируют.

Пример директивы для Яндекса:

User-agent: Yandex
Clean-param: filter_color&filter_size&min_price&max_price&orderby

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

Когда страницы фильтра стоит индексировать

Если люди ищут «чёрные кроссовки 42 размер» или «смеситель для кухни с высоким изливом», такие сочетания заслуживают отдельной посадочной страницы. У неё должны быть чистый адрес, собственный H1, title, description и, желательно, короткий текст.

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

Удобство фильтра для покупателя

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

Мобильная версия

На телефоне фильтр обычно прячут за кнопкой «Фильтры» и открывают в отдельной панели. Внизу панели нужна заметная кнопка «Показать N товаров». Панель не должна перекрывать кнопку закрытия и прыгать при выборе значений.

Порядок и вид фильтров

Самые важные характеристики — сверху: цена, размер, бренд.
Для цвета — цветные плашки, для цены — ползунок с полями ввода.
Длинные списки значений — с поиском внутри или со сворачиванием.
Значения без товаров — скрыты или неактивны.

Выбранные значения

Покупатель должен видеть, что выбрано, и убирать значения по одному. Кнопка «Сбросить всё» обязательна.

Сценарий: подбор по параметрам автомобиля

В магазине автозапчастей покупатель ищет не «фильтр масляный», а деталь для своей машины. Здесь обычный фильтр по атрибутам неудобен: нужен пошаговый подбор — марка, модель, год, двигатель. Каждое следующее поле показывает только значения, подходящие к предыдущему выбору.

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

Ошибки при настройке фильтров WooCommerce

Ниже — ошибки, которые встречаются в магазинах чаще всего.

Характеристики в локальных атрибутах

Товары импортированы с пользовательскими атрибутами, и фильтр их не видит. Приходится переносить значения в глобальные атрибуты — на большом каталоге это отдельная задача.

Дубли значений

«Хлопок», «хлопок 100%», «Хлопок.» — три значения вместо одного. Покупатель выбирает одно и теряет товары с другими вариантами написания.

Атрибут на каждую категорию

«Цвет футболок», «Цвет брюк», «Цвет курток» вместо одного атрибута «Цвет». Фильтр работает, но поддержка превращается в хаос.

Открытые для индексации адреса фильтра

Тысячи страниц с параметрами попадают в индекс. Поисковик тратит время на мусор, а важные страницы обновляются медленнее.

Тяжёлый плагин на слабом хостинге

Плагин фильтрации с десятками функций, которые не используются, и каталог на хостинге без кэша. Каждая категория грузится несколько секунд.

Фильтр без аналитики

Фильтр запустили и забыли. При этом никто не смотрит, какими значениями пользуются, а какие остаются без кликов. Цели в Метрике на использование фильтра и записи сессий быстро показывают, что покупателю мешает.

Чек-лист фильтра товаров

Характеристики для фильтра заведены как глобальные атрибуты.
Значения атрибутов без дублей и в едином формате.
Все товары размечены нужными атрибутами.
Для каждой категории выбран свой набор фильтров.
Есть фильтр по цене и по наличию.
Фильтр удобен на телефоне, есть кнопка «Показать» и сброс.
Время реакции фильтра проверено на самой большой категории.
Адреса с параметрами фильтра закрыты от индексации.
Для популярных сочетаний сделаны посадочные страницы.
Обмен с 1С не ломает атрибуты при выгрузке.

Частые вопросы

Как сделать фильтр товаров в WooCommerce без плагина?

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

Почему фильтр WooCommerce не показывает атрибут?

Скорее всего, атрибут заведён как пользовательский в карточке товара, а не как глобальный. Встроенные фильтры работают только с глобальными атрибутами.

Какой плагин фильтрации WooCommerce лучше?

Универсального ответа нет. Выбирайте по задачам: фильтр по произвольным полям, SEO-страницы, скорость на вашем объёме каталога, совместимость с темой. Тестируйте на копии сайта.

Как сделать фильтр по цене в WooCommerce?

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

Нужно ли закрывать страницы фильтров от индексации?

Большинство — да, через noindex или canonical, а для Яндекса ещё и через Clean-param. Индексировать стоит только выбранные сочетания с отдельными посадочными страницами.

Почему фильтры тормозят на большом каталоге?

Обычно из-за фильтрации по метаполям, пересчёта счётчиков и слабого хостинга. Помогают глобальные атрибуты, объектный кэш и плагин с кэшированием.

Можно ли сделать фильтр без перезагрузки страницы?

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

Как фильтр работает с вариативными товарами?

Фильтр по атрибуту находит вариативный товар, если у него есть подходящая вариация. Проверьте, как ваш плагин учитывает наличие конкретной вариации.

Как настроить фильтры товара WooCommerce для разных категорий?

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

Можно ли фильтровать по нескольким значениям одного атрибута?

Да. Для этого у фильтра выбирают режим «ИЛИ»: покупатель отмечает, например, чёрный и белый цвет и видит товары обоих цветов.

Сколько стоит магазин с продуманным фильтром?

Небольшой магазин на WooCommerce стоит от 80 000 ₽, фильтр и поиск по каталогу — от 12 000 ₽. Сложные фильтры и SEO-страницы увеличивают объём. Подробнее — в статье о том, сколько стоит интернет-магазин на WooCommerce.

Итог

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

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

Если нужно сделать удобный подбор в вашем магазине, я как частный разработчик приведу в порядок атрибуты, настрою фильтры, скорость и индексацию на WooCommerce. Подробнее — на странице интернет-магазина на WordPress. Работаю напрямую, без посредников.