Powerful filters

As you all know, a great filter could significantly improve website navigation. Still it's not as easy as it seems. Not every Joomla catalogue component allows to use a filter for material searching and even fewer extensions enable configuration of such a search as you wish.

JBZoo component is a handy catalogue constructor with flexible filters as its key feature. You can make a search by almost all customer or standard fields, while configuration will mostly require just some mouse manipulation in the control panel. Just grab a field and move it to a desired position.

Let's quickly review some of JBZoo search key features.

Which options do JBZoo filters have?

  • Searching by main fields like a name, a date or even a category, i.t by standard features of materials.
  • Filtering by any additional fields with a text, like selects, radio-buttons, rating, full-text search etc.
  • Searching by number or date ranges. There are handy widgets to do this, like calendars and sliders.
  • Text fields of the search form have autocomplete (if you start typing part of the word, a list with different variations of the words, starting with entered letters, will appear below). Selection of words depends on the content of your catalog.
  • Quick search - you can set an option to automatically submit filter form on any field changes, on changing radio-buttons, for example.
  • Interesting widgets: we have added range sliders, stylized buttons, calendar etc.
  • Items count - displays an amount of items which meet a filter requirement for this field.
  • Related fields - when you select a country, a list of its cities will be loaded, selecting a city - load of its streets respectively etc.
  • Quick filtering by any item properties as a menu.
  • Results page has "noindex, nofollow" meta in order not to confuse search engines.
  • A filter is able to search items by price, by "New" flag, by "Sale" and by stock availability.
  • Filter settings allow you to specify whether you want to search by base price or by price with a discount.

Which settings does a module have?

JBZoo set includes several ready-to-use search form templates. Fields can be displayed as several columns or, on the contrary, rank them in one line. Below there are some examples which you can find on the demo website.

One columnTwo columns

Four columns

As additional options for the filter form you can see such settings as logic (AND / OR), number of items per page, results sorting and utility buttons.

Amount of results per pageOrdering of results

Buttons configurationButtons in the filter form

Fine-tuning of the search fields

JBZoo filter allows you to filter items by such fields as pub date, category, name etc. Configuration is performed by simple dragging of the fields. Generally speaking, this is a constructor where you create your own form from different pieces (fields).

Configuring filtering by main fieldsConfiguring checkbox field in the back-endChanging checkbox configuration

Each field has lots of its own settings. For example, there is an option to display a field as a set of buttons while it is a simple text field in the back-end.

Configuring filter field

Here are some examples of displaying the same filter field:

Category filter - variant 1Category filter - variant 2Category filter - variant 3Category filter - variant 4

Radio button - variant 1Radio button - variant 2Radio button - variant 3Radio button - variant 4

Searching by range

Initially, all fields in ZOO were textual. We had to do a lot of hard work in order to process entered numbers as numbers and not as a text. Still, we managed it and now you can filter any items by ranges of dates or numbers.

Configuring ranges of dates or numbers

Here are some examples of filtering by ranges:

Numbers range as a slider

Dates rangeChanging date in a filterRange filter as input fields

Autocomplete in a text fields

Configuration of autocomplete

It functions as follows: User starts typing a word, if the entered text matches first letters of the words which are present in your application, a list with matched variants will appear under the search field.

Autocomplete

Related elements

We have added a new element "Cascading Select" allowing you to build a tree-like structure of item properties. For example, to select an address of a selling point, we first choose the right country, then a city of this country and a specific address. Nesting is not limited. In the back-end and on the website it looks like this:

Configuring related selectsCorresponding cities appear after choosing a countryStreets appear after choosing a city

Quick search as a menu

Using special module, you can output all possible values of a specific field as a list. This way it's very easy to make a search using links.

Configuring menu fields

There are two variants of displaying this menu on the web-site: as an “accordion” and as a standard list.

Accordion menuList-style filter

In the end...

As a result we have a flexible and easily configurable tool, using which you can create a filter that perfectly suits your needs.

Enjoy!

Assembled filterAssembled filter

Assembled filter

Assembled filter