Product Filter фильтр товаров Woocommerce

WooCommerce

 Привет! Мы продолжаем разбирать самые интересные и самые полезные плагины для интернет-магазина Woocommerce! Сегодня вы узнаете как добавить на свой сайт ajax фильтр товаров woocommerce. Вы сможете искать товары по фильтрам – категория, цена, размер, цвет, тег, распродажа, в наличии, по заголовку, SKU. Можно указать свои заголовки для фильтров. Можно скрыть определённые элементы.

Можно отображать товары в фильтрах в виде ссылки или чек-бокса. Можно выбрать стиль отображения фильтров, вертикальный или горизонтальный. Можно указать количество колонок и т.д.

 

Product Filter woocommerce

 

Установить плагин Themify Product Filter вы сможете прямо из админ-панели WordPress. Перейдите на страницу: Плагины – Добавить новый, введите название плагина в форму поиска, нажмите Enter, установите и активируйте плагин.

 

Themify Product Filter

 

Далее, после установки и активации плагина, перейдите на страницу: Product Filters. На данной странице будут отображаться все созданные фильтры. Чтобы создать новый фильтр нажмите вверху на кнопку – Add new.

 

Product Filters

 

Далее, у вас откроется окно для создания фильтра товаров.

 

фильтр товаров интернет-магазин

 

– Form Title, укажите название фильтра.

– Layout, выберите стиль отображения фильтра.

– Empty Fields, не показывать пустые поля.

– Product Sorting, скрыть сортировку товаров.

– Product Count, скрыть отображение количества товаров.

– Pagination, скрыть пагинацию товаров.

– Products Per Page, количество отображаемых товаров на одной странице при включённой пагинации.

– Toggle Field Groups, отображение переключателя для групп.

– Scroll To Result, включить прокрутку.

– Result Page Template, показывать результаты на той же странице или на отдельной странице.

 

Далее, вам нужно с помощью мыши перетащить нужные вам фильтры в нижнее поле. Каждый фильтр можно настроить, указать название фильтра и настроить дополнительные параметры. В конце, чтобы сохранить созданные фильтры нажмите на кнопку – Save.

 

Edit Product Filter Form

 

Далее, на странице “WooCommerce Product Filters” у вас будет отображаться созданный фильтр. Вам нужно скопировать шорткод фильтра и вставить его на страницу, в запись, виджет или php файл.

 

WooCommerce Product Filters

 

Всё готово! У вас на сайте будет отображаться готовый фильтр товаров Woocommerce!

 

Остались вопросы? Напиши комментарий! Удачи!

 

info-effect.ru
Добавить комментарий для Олеся Отменить ответ

Имя и Email указывать не обязательно. Чтобы получить ответ на свою электронную почту, укажите свой Email.

  1. grizzli

    Спасибо за обзор! Интересный плагин. Подскажите пожалуйста, как привязать созданный фильтр к определенной категории товаров, что б отображался в одной категории, и не отображался в другой?

    Ответить
    1. Admin автор

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

      Ответить
  2. Helena

    Спасибо! Статья отличная! Сегодня претворю в жизнь!

    Ответить
  3. Александр

    Работает не корректно! Всегда грузит одно и то же что бы не выбрал, а так надеялся на него, может что-то не так делаю?

    Ответить
    1. Admin автор

      Что значит “Работает не корректно” ? “Всегда грузит одно и то же что бы не выбрал”, что вы имеете ввиду ?

      Данный плагин Я лично проверял на своём черновом сайте, всё работает !!!

      Ответить
  4. Александр

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

    Ответить
    1. Admin автор
      Ответить
  5. Андрей

    Здравствуйте. Вопрос. Как сделать, чтобы фильтр отображал результаты только из той категории в которую зашел пользователь? А то получается, что заходишь в категорию “Рубашки” выбираешь в фильтре “Красный цвет” и фильтр показывает ВСЕ товары с атрибутом “Красный цвет”.
    И еще вопрос. Почему-то, на сайте разработчика, в демо-видео фильтр работает без перезагрузки страницы, а по факту страница перезагружается, или это у всех так?))

    Ответить
    1. Admin автор

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

      Ответить
  6. Алексей

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

    Ответить
    1. Admin автор

      Здравствуйте. Товары и не должны сразу отображаться. Только при выборе фильтра.

      Ответить
  7. Константин

    Как и писали выше: всегда выбирает одно и тоже, какой бы фильтр не выбрал. удалил.

    Ответить
    1. Admin автор

      Пишите автору плагина, пусть исправляет свой косяк, если он его ещё поддерживает.

      Ответить
  8. Владимир

    Здравствуйте. В плагине есть еще возможность фильтра по фирме производителя. Как это реализовать? Хотел бы cделать такой же фильтр как на этом сайте.

    Ответить
    1. Admin автор

      Здравствуйте! Можно создать метки или категории с названием брендов и добавить в них соответствующие товары. Ярлык меток можно изменить на Бренды! Можно вообще вывести бренды отдельно с помощью плагина – WooCommerce Brands слайдер брендов товара! Можно ещё поискать какой-нибудь плагин, на WordPress их много, думаю можно найти что-то подходящее. Вот сюда ещё загляните, очень много Супер полезных плагинов Woocommerce!

      Ответить
  9. Вовка

    супер, бомба, вообще класс, зэ бэст,…не работает фильтр

    Ответить
    1. Admin автор

      Здравствуйте! Фильтр рабочий, только что проверял! Наверно вы не до конца разобрались в настройках! Что именно у вас не работает? Вот здесь ещё фильтры есть – Супер плагины Woocommerce!

      Ответить
  10. Надежда

    Здравствуйте, а как связать в этом фильтре выбор по двум атрибутам товаров? т.е. выбираем по первому атрибуту цвет – красный, а во втором размеры, но не все значения, а должны быть доступны для выбора только те которые есть в красном цвете.

    Ответить
    1. Admin автор

      Здравствуйте! Наверно проще создать такой атрибут, который объединяет в себе все нужные вам качества товара. Хотя, не понимаю, зачем это делать, если пользователь видит все доступные атрибуты, он просто выберет нужный ему атрибут и всё. Если такого атрибута нет, создайте его.

      Ответить
      1. Надежда

        Илья, спасибо за ответ. А можно уточнить Что значит создать атрибут который объединяет в себе нужные качества товара? допустим у меня интернет магазин одежды. Цветов 20, размеров 10. т.е. максимальное значение вариаций будет 200(!) если объединить эти два атрибута в один. И в фильтре все 200 будут присутствовать для выбора? и Пользователь будет выбирать из них для фильтрации? На мой взгляд это не очень удобно :) Смысл моего вопроса чтоб избавиться от ситуаций когда Пользователь выбирает комбинацию атрибутов для фильтрации которых нет у товаров в магазине. PS Вы пользовались Умным фильтром на сайтах интернет магазина разработанных на Битриксе?

        Ответить
        1. Admin автор

          Нет, с Битрикс я не работал. А как такое возможно, что атрибутов нет у товаров? Атрибуты нужно привязывать к товаром, тогда такой ситуации не случится. Я как раз это и имел ввиду, один атрибут можно привязать к нескольким товарам.

          Ответить
  11. Надежда

    prnt.sc/gqnmrd вот как мне нужно чтоб работал фильтр. Themify Product Filter можно так настроить? или может другой фильтр для Woocommerce есть который так можно настроить? вы же по многим плагинам делаете обзоры :)

    Ответить
    1. Admin автор

      Понимаю, такого плагина я точно не встречал. Вам разработчик нужен.

      Ответить
  12. Кейт

    Добрый вечер! Спасибо за инфу, но интересно, как сделать так чтобы при фильтрации товары выходили на этой же странице и фильтр не исчезал?

    Ответить
    1. Admin автор

      Здравствуйте. Параметр Result Page Template позволяет показывать результаты на той же странице или на отдельной странице. Как фильтр исчезает?

      Ответить
  13. Владислав

    Здравствуйте! Есть ли статья или решение, которое позволит сделать иерархию категорий в виде аккордеона (сворачиваемые дочерние категории)?

    Ответить
    1. Admin автор

      Здравствуйте. Да, есть такой плагин, смотрите здесь, в разделе “Категории” – Супер плагины Woocommerce.

      Ответить
  14. Олеся

    Здравствуйте,

    Почему то не видит прописанных атрибутов. Например, бодиков для мальчиков 5, а в фильтр не видит ничего. Подскажете в чем проблема?

    Спасибо

    Ответить
  15. Дарья

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

    Ответить
    1. Admin автор

      В файл который выводит товары.

      Ответить
  16. Ольга

    Мне нравится фильтр, если делать с атрибутами всё корректно отображает, и сначала можно выбрать производителя, потом у этого производителя вид товаров, просто надо все правильно настроить и настраивать сам магазин и сами товары тогда все будет работать.. Но!!!!!!!! в бесплатной версии кнопку фильтр не переименовать ни как с админки… а на странице с товарами он подгружается каждый раз когда что то выбираешь и не все клиенты догадываются что потом ещё надо кнопку фильтр нажать чтоб он отфильтровал. Заказывала программиста всё отладил, но при обновлении каждый раз слетает…. Если у кого есть решение проблемы напишите

    Ответить
  17. Ольга

    О и я нашла как избавится от кнопки фильтровать, осталось переименовать кнопку сброса

    Ответить
    1. Admin автор

      Рекомендую плагины:

      SiteOrigin CSS
      Loco Translate

      Ответить
  18. стас

    как вставить шорт код?

    Ответить
    1. Admin автор

      Куда вставить?

      Ответить
      1. стас

        на страницу с товарами, она как по стандарту называется?

        Ответить
  19. Дмитри

    Добрый день. Плагин супер, использую. Но есть вопрос, как сделать чтобы при фильтрации выводилась не ссылка на основной товар, а на его вариацию? Т.е я фильтрую допустим размер 150х150, у меня есть такая вариация из десяток других, и он мне показывает все товары где присутствует эта вариация, но ссылка не ведет именно на эту вариацию. Копался в файлах, нашел post_type = product, меня на product_variation не помогло. Может знает кто решение, буду благодарен.

    Ответить
    1. Admin автор

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

      Ответить
      1. Дмитрий

        Да писал, не отвечает он. Видимо придется отдавать кому-то на доработку. Спасибо за ответ.

        Ответить
  20. Виктор

    Что – то у меня на сайте этот фильтр не работает. Что не выберешь, всё равно унитазы. Самокритично, конечно но не полезно.

    Ответить
    1. Admin автор

      Есть ещё один плагин Ajax фильтр товаров Woocommerce, попробуйте его.

      Ответить
  21. Алексей

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

    Ответить