In order to get the filters showing on your website we need to do follow these steps:
Firstly, make sure the app is installed on your theme.
Step 1 - Create a new filter group
The filter menu is separated by groups, such as color, price, type, material and size.
You can create a new filter group by clicking the '+New Filter Group' button near the top of the page.
There are also helpers in the tabs along the top for creating groups based on price, type, brand/vendor, variant options (size, color, material, etc.) and tag prefix. These are very helpful so we recommend trying them out to start with, as they skip all of the following steps and automate most of the process of setting up a group.
Step 2 - Choose the type of filters you want to use in the new group
Select the type of filters - this is the parameter the app will 'look up' in your product's data. For example, if you select 'Vendor' here the app will look up vendors you have for products.
A quick explanation for each type of filter:
Tags - use this if you want to set up your filters based on the product tags you have applied to your items.
Collections - use this if you already have existing collections set up in your store that you want to use for filtering, this should be the first choice if you already have collections set up, as it will avoid any chance of duplications occurring.
Type - create filters based on all Product Types in your store.
Vendor - create filters based on all Vendors in your store.
Price - use this to set up filters for price ranges, you'll need to set up the ranges, and the app will add the required tags and collections for you.
Variant - use this option to set up filters based on your product variant options, such as "Size" or "Color", this option uses the Variant Tagger app to tag your products according to their in stock variants.
Tag Prefix - use this option if you have grouped or prefixed tags, such as "category_tags", you can provide the prefix for the app to "look for" and it will automatically generate filters for each tag that has the given prefix.
Note that you may not see your filters showing up instantly, especially if the app needs to add tags or look for product types or vendors, this might take some time to complete, but you can check on the job queue by clicking on "Jobs" in the app sidebar.
Step 3 - Fix collections
You may receive a warning about some collections, if they require updating to work with the filtering.
There are a few types of warnings - Sync tags, No Matching Collection, and Collection rule must be updated.
If you have a collection that is defined by a field that is not a tag (such as vendor or produyct type), Power Tools will ask you for your permission to edit the tags, this must be done before you can show that filter on your store.
Since the tags and the collection handle need to be in sync, any products in the collection will be tagged with a tag matching the collection handle, while any products not in the collection will have that tag removed.
For example, if we had a Smart Collection called 'Under $50' and handle of 'under-50' with a rule for the product price being below $50, every product in that collection will be tagged with 'under-50'. Likewise any product that is tagged with 'under-50' but is not in that collection will have that tag removed. Once set up, this process will run automatically, keeping your store in sync.
No Matching Collection
If you see a warning for "No Matching Collection" it means that the app could not find a collection with that handle in your store, if you know that collection does exist, you can remove the filter and add it again, using the "Collection" type - to ensure the correct collection is added. Otherwise you can click to allow the app to create a new collection for you.
Collection rule must be updated
The Filter Menu requires that all tags used are in the handle format (lowercase-with-dashes), any tags used in filtering will be converted to this format automatically. Which may result in some collection rules requiring an update to match the new tag format, if you see this warning you can click to allow the app to update the required colelction conditions.
Step 4 - Save & Update
Once all of your filter menu items have been set up and are looking good, click on the Save and Update button in top right.
This will start a job to update the filter menu on your site. Note that it may take some time to update all of your product tags on the first run, you can check on the job queue by clicking on "Jobs" in the app sidebar. Not that your filters may not show up on the storefront until all updates are completed.
TLDR; Here is a video guide on how to set up your filters -