Question Settings
The first thing you need to do after the installation of the plugin is to create a question for the filter. Go to the WooCommerce - SF Questions page and click the Add New button.
Use the post content as a description of the question.
The label setting will be used as the step's name.
Alternatively, the title of the post will be used instead.
This part is the same for any filter type and view.
First of all select one of view types. Possible types are:
- Select - simple HTML element;
- Radio - simple HTML element;
- Checkbox - simple HTML element;
- Chips radio - inline radio view for many variants;
- Chips checkbox - inline checkbox view for many variants;
- Button radio - vertical radio view for a few variants;
- Button checkbox - vertical checkbox view for a few variants;
- Image radio - simple HTML element with an image within;
- Image checkbox - simple HTML element with an image within;
- Multi-choice checkbox - complex element to define OR/AND/NOT relation for each option;
- Multi-choice range - complex element to define OR/AND/NOT relation for each option;
- Number - precise numeric input with one handler;
- Number from - range input with one handler;
- Number to - range input with one handler;
- Number between - range input with two handlers;
- Formula - calculate a value by a formula.
After you can select a filter type setting. You can see not all of the variants are allowed.
This depends on the selected view type. Possible types are:
- Attribute - filter by a product attribute taxonomy;
- Price - just a price filter;
- Tag - filter by product tags;
- Category - filter by product categories;
- Manual - manual selecting of products or categories;
- Meta - filter by meta key.
Numeric View Type
Numeric view types have their own settings bundle. This is possible to set From
and To values caption, the Unit text and change the step of the value. If you
have decimal values as answers set this setting to the lowest possible fraction.
Also, this is possible to Enable/disable the slider for these types of views.

Checkbox/Radio/Select View Types
Select view type can have an Empty value to oblige the user to make a choice.

Types with the only answer ( radio / select) have the Doesn't matter settings
group. It allows to output an answer which doesn't modify the query anyhow. Anyway, this type of views always requires a selected value.

Checkbox-based view types have a Relation setting to define "OR"
or "AND" relation between the selected answers. This also possible to define
Minimum and Maximum values selected.

For radio / checkbox / select view types you can use the Unmet values behavior setting.
It allows to handle question values which leads to zero-products result. Possible values are:
- Show values as usual;
- Show values as disabled;
- Hide values at all.

Terms-based View Types
Radio / checkbox / select view types with attribute / tag / category filter types there is a
possibility to Include/exclude specific terms define them by IDs separated by a comma.
Here is how you can find them.
Alternatively, you can use a tiny plugin to see these IDs.
Also, this is possible to Hide empty terms for them.
Not-numeric views with attribute / tag / category filter types have a possibility to Show count of products near the value name.

Multi-choice View Type
Multi-choice view types have their own settings bundle. This is possible to choose which of 4
possible values will be used for the question, set their order and change captions.

Image View Type
Image view types have thumbnails alignment and thumbnail size settings.
Thumbnail size setting supports inline size names registered on the site.

Formula View Type
Formula view type provides filtering by a calculated value according to the formula string. That's a complex feature to filter products by numeric attribute / price / numeric meta.
This question type outputs no fields itself. You need to set the required input fields in the question description editor. To output a field use the [wcsf-value-input name="%SOME NAME HERE%" value="%SOME VALUE HERE%"]
shortcode.
The name
attribute is required for saving the data. Checkbox/radio types require a value
attribute also. All other required input attributes might be
passed the same inline way.
Here are a couple of using examples:
<label>[wcsf-value-input type="number" name="My Numeric Field" value="1" min="1" max="24" class="form-control"]
Numeric value </label>
<label>[wcsf-value-input type="checkbox" name="My Checkbox Field" value="Yes" class="form-check-input"]
Checkbox Field </label>
<label>[wcsf-value-input type="radio" name="My Radio Field" value="Yes" class="form-check-input" checked="checked"]
Yes </label>
<label>[wcsf-value-input type="radio" name="My Radio Field" value="No" class="form-check-input"]
No </label>
Not all input types are supported
Unsupported field types are: "button", "image", "reset", "submit".
First of all, define default Formula variables and their values. There might be just static variables like x = 10
. This is necessary because formula code works better with string variables than with pure number values.
Also, with the Formula variables setting you can define variables that might be not passed from the shortcode, namely the checkbox fields.
Much probably, you will have multi-word field names but the formula doesn't support them also. This way you need to define Formula name aliases as "My Custom Field => my_custom_field"
and use the alias in the formula field.
Moreover, you might have string field values that should be transformed into a numeric value. That might be helpful for radio/checkbox types. For that you need to define Formula value aliases as My Custom Field => Value One => 123
Before the execution of the formula, all of these settings will be used to find the appropriate variable value.
If there is a mistake in the formula you will see an exception on the results page.
The final thing necessary to configure is the Formula operator setting, which allows to compare the selected question source with the calculation result. This is possible to filter products which are:
- Equal to the calculated value;
- Not equal to the calculated value;
- Less than the calculated value;
- Less or equal to the calculated value;
- More than the calculated value;
- More or equal to the calculated value.
Also, this is possible to use the next built-in functions within the formula:
- sum - Calculate the sum of values;
- abs - Absolute value;
- min - Find the lowest value;
- max - Find the greatest value;
- round - Rounds a float.

Action On Click
Not-numeric views have the Action on click setting.
It allows making action on selecting the value. This is possible to do:
- None - to do nothing;
- Submit - submit value and stay on the step;
- Submit and go next - submit value and go to the next step;
- Submit and go to results - submit value and go to the last step.

Additional GET Parameters
For not multi-choice view types you can add an Additional GET parameter. That's might
be helpful if there is another filtering plugin on your site and you want to pass queried values
from the Step Filter to it on the result page. For example, you can add a "category_id"
additional parameter for the category filter type to have it as
&category_id={requested_value}
in the URL of the result page.
As the Number between view type has two result values you can define two keys separated by
the "|" symbol.
For attribute / tag / category filter types also possible to change an Additional GET
parameter term source to define what term property will be used as a value of the GET parameter.
Currently, possible values are ID/Slug/Name.

Dependency Rules
There is a possibility to make any question invisible in the filter until of firing of some dependency.
Use the Dependencies settings table for this. Select another question in the dropdown,
then select its value in the next field and the comparison operator. Then this question will be
visible only then this dependency will be met.
If you need to make more complex dependency then add more dependency rows in the table and define relations between them.

Question Binding
If you have a couple of different filters with different questions (for example, one in a page body
and the second in a sidebar) you can pass the value from one question to another using the
Bind with question setting. To make this binding both directions set this setting for
both bonded questions.

Ignore Filtering
You can create any type question and use it in a filter but ignore it while filtering the results. The question might affects the dependencies and statistics but not the results.

Attribute Filter
This is necessary to choose one product attribute as a source of the values.
Filtering with the Numeric view will work correctly only with the
numeric values of the attribute. Attribute value names will be used as float values.
All other settings depend on the selected view type.
Price Filter
Price filtering can have only a numeric view and have no extra-settings except the numeric's.
Min and max prices of the products will be used as a range.
Category Filter
With category type the question will have product categories as values.
You can define Category parent setting to get sub-categories by this category only.
If you need to output only specific sub-categories levels or limit max categories tree depth
use Start from categories level and Max sub-categories level.
But keep in mind the max sub-categories level setting can't be less than start from categories level
setting

All other settings depend on the selected view type.
Manual Filter
Manual filter type allows to create and configure each possible value you need in the question.
Click on the Add a value button to add a row with settings.
Each value could have the settings:
- Image - for image checkbox/radio view types;
- Pre-checked - setting to make the value checked by default;
- Name - a label of the value;
- Dependencies - define the rules of showing of the value;
- Source - set the value's source.

In the value source modal you can select one of the values:
- Any product - not filtering at all;
- Product - choose products in the result of the value.
- Category - filter products by one or a few categories;
- Tags - filter products by one or a few tags;
- Attributes - filter products by flexible attribute rules;

Meta Filter
The Meta key setting is required for this type of filtering. Place a string to it and the
question will collect all of the possible values of this meta key of products and then use them
as the question's values.
For the numeric views the min and the max meta values will be used for the limits,
but they should have numeric type.
Filter Settings
Basic Settings
First of all select a source of the steps. That might be just questions posts or
question categories. For the second case, each step will output a few questions attached to a category at once.
Questions order
Then you're using question categories as steps their questions might be ordered not as you wanted to have them.
To solve it easily use any 3rd-party plugin the posts sorting, for example,
Simple Custom Post Order.
Select created questions for using and change their order.
There are a few modes allowed:
- Free walk - allows to walk through the questions as user wants;
- Step by step - allows only to go consistently though questions;
- Single-step - show all questions one after one;
- Sequence - show questions one after one consistently.
This is possible to add extra query arguments which will be used while filtering the results.
You can include/exclude specific products, categories, or product attributes in the filtering results.
After tuning all settings, copy the shortcode into any page content to output the filter.

Results Settings
Results URL should have a URL to a shop or category page or just "#" symbol to stay on the same
page (for using as a widget).
Empty results URL setting will lead the user to a specific page if there are no filtering results
by his request.
This is possible to Show results within the filter on the last step without a redirect
to another page. This tab could have any title.
If you tick the Show preliminary results count setting there will be a tooltip shown on each
question value change.
Also, you can limit the Maximum products number results.
This is possible to make an Instant redirect to the only result page for the paged results
showing.

Behavior Settings
If you want to see the statistics of filter queries tick the Collect inquiries for statistic for this. You will see this statistic on a special plugin's page. This statistic doesn't collect any personal information.
This is possible to Scroll to top on the form update to let the user see the starting of the next question on submit. Also, there is the gap setting to not scroll the page too high.
Navigation items might have one of the Nav action on click - just go to the next step or submit and go next.

View Settings
Select one of Nav view values to change the navigation view.
Use the post content as a description of the first step. If you need this, check the
Enable description tab setting. To change the step title, change the
description tab title setting.
You can enable/disable the value list showing within the filter or on the shop page.

Result PDF Settings
PDF customization
To modify the PDF template make a copy of views/products/pdf.php
to your active theme (or child theme) directory to woocommerce-step-filter/products/pdf.php
Result PDF header height in cm allows to define the top header size for each page.
Result PDF header content will be used as the header for each page.
Its color and inner padding might be configured right there using CSS.
This is possible to use special shortcodes to output the current page number and total pages number.
Result PDF top description content will be placed before the results loop.
Result PDF footer height in cm allows to define the top header size for each page.
Result PDF footer content will be used as the footer for each page.
Its color and inner padding might be configured right there using CSS.
This is possible to use special shortcodes to output the current page number and total pages number.
Result PDF bottom description content will be placed after the results loop.

Controls Settings
Controls settings allows to choose which buttons are used in the filter and their labels.
Moreover, all controls might have different classes for their styling and behavior.
As the main plugin styles are based on the Bootstrap 4 framework you can use any from the
available styling classes of buttons.
Also, there are a few classes to control buttons text and icons appearing:
- hide-text - hides text of the button but keeps it for screen readers;
- hide-text-on-mobile - hides text of the button on small screens but keeps it for screen readers;
- icon-left - define on which side of the button the icon should appear;
- icon-right - define on which side of the button the icon should appear;
- show-icon - always shows a pre-defined button icon. Requires icon-left/right class for work;
- show-icon-on-mobile - shows a pre-defined button icon on small screens. Requires icon-left/right class for work;
