The How To PrestaShop video tutorial series continues with a guide to using the layered filter search module in PrestaShop 1.6. In the video I explain step by step how to set up the layered filter in your store so that you’re customers can find products more quickly and efficiently. A full transcript of the video is included below.
Hi, and welcome to a new PrestaShop ‘How To’ Tutorial and today we’re going to be talking about the layered navigation or the layered filter option that you can find within PrestaShop. So if you’re looking at a PrestaShop front end store and you were within a particular category, PrestaShop give you the option to filter the product by particular attributes or features of each individual product within that category.
So at the moment, I am within the Women’s section of the default PrestaShop store (see screen) and I’ve chosen two filters; yellow and casual. This is giving me one option to shop for, which contains those two particular filtered options.
Now, if I delete those, you’ll see that within the women’s section, they’re actually dresses and shoes of all different colours, which are contained within that category. But to make it easier for the customers to shop and for them to limit the products they view to only the products they wish to buy; this filtered option gives them an easy way to do it.
So if I just wanted to see all of the green dresses, there we go (see screen). It tells me there’s one dress available within this category with the colour option of green. Alternatively, I could look up the features and maybe just have a look at the casual dresses (see screen). There’s the casual dresses and if I just wanted to look at yellow casual dresses, again, it gives me the option of one product to shop. It eliminates the choice for the customer and can also possibly increase your conversion rate when you’re not offering too many options to the customer at once enabling them to make a more informed purchase or choice and possibly a quicker purchase.
TIME – 1m:51s
So how does this work? Well, within each product, as you’ve been adding the attributes and features to your products, each of the attributes and features has the option to add itself to that filter and this is done by the indexable button ‘Yes’ or ‘No’ here (see screen) and this is used to add this attribute to the layered navigation module. So if you choose to add each attribute or feature to the module, then it will appear within the list here (see screen) and the module view on the front end of enabling the customer to filter by that particular attribute or feature.
Once you’ve added all of your attributes and your features to your products, you can then go to the module. The module itself is called layered navigation block and if we enter the configuration screen, you’ll be given various options to configure this particular module.
The first option is indexes and caches. This is where you add any missing prices or missing attributes to the attribute and the layered navigation index. You can simply do that by clicking each of the buttons here (see screen) on a regular basis or if you want to automate this, you can actually use these URLs here (see screen) within a cron job. A cron job is something you set within your server and it might be worth asking your server guys to do this. All you need to do is just send them this particular URL (see screen) and ask them to set a cron job up. A cron job is a way of alternating processes on the server to happen maybe every 10 minutes, every 10 hours or every 10 days, so maybe you could have these options automated every morning to index any new products you’ve added to the system.
TIME – 3m:44s
PrestaShop actually recommends a nightly rebuild here (see screen), so maybe you can have these set up as a cron job firing off in the middle of the night. The second option is your template. Now, you can create different templates for each category. At the moment, I’ve got eleven categories using this particular template (see screen) and if you go into the edit option, you’ll see that all of my categories have been ticked so this particular template is going to be used for all my categories.
It does give you the option though to maybe exclude women from this particular template, then you can create a new filter template for that particular category which may be just includes the colour option, so that within the dresses, you can only filter your products by colour.
But in this instance, I’m choosing one template to serve all of my categories. Now, within the template, you have different filter options and this is what you’ve been building up by adding your particular attributes and your particular features to each of the products, so you can see here there’s all the features, which I’ve added to the store at the moment and all of my attributes. But what it also does is it takes some default options within a product such as the stock availability, the product condition, the product manufacturer or brand and the product weight. So you could, if you so wish filter by these options here (see screen) as well.
TIME – 5m:11s
Maybe if you did have lots of brands on the page − so you’re looking at a category with dresses from Gucci, Armani and various other brands, you could filter that page by just ticking the particular brand you wish to view and hiding all the other products which don’t actually fall under that brand.
So at the moment, we’re filtering by sub-category so at the moment, as I go into women, I delete my choices (see screen), what this is actually doing is not just pulling in the products within the women’s section, it’s also pulling in the sub-category products within tops and within dresses. Because I’ve set the option to ‘yes’, it will do that. If I set it to ‘no’, the filter will only apply to products which have been associated with women so it won’t pull in any products from these sub-sections, it will just show me the products within the women’s section.
When I say ‘associations’, what I mean is if we were to look at this particular printed dress here (see screen), you look at the associations, this printed dress is available in The Home, in Women, in Dresses and in Casual Dresses. If I was to eliminate that from the Women’s category, you would expect that dress not to show within that category when I viewed it within the front end. But because you’ve said to the filter include products from all sub-categories, it will pull in this particular dress (even though it’s only in tops and dresses into the women’s section) because the filter pulls in products from the category you’re looking at plus products from your sub-categories.
TIME – 7m:01s
If we go back to our template (see screen) − also, you can filter by price. This enables a price filter and a price slider so we can have this as a slider (see screen), which enables you to filter out products from different price brackets, so it eliminates anything which doesn’t fall in between these particular price brackets.
You can also set this to rather than being a slider, you can set it to be a list of values. So if we save that, we go back to the front end and we refresh (see screen), it will pull all the price brackets and it will give you £18 – £26, £26 – 35 − so it gives you a price bracket to choose from. If you click that (see screen), it will just show you the products which fall within the $40 – $53 section, so that’s priced within brackets or there’s one more option with prices and we can choose an input area.
If we go back to this section here (see screen), and we refresh − so I said I just want to see prices from $10 – $20. There’s actually nothing available. (LONG PAUSE) If we go back to the same input box, you can say from $10 – $30, (LONG PAUSE) you’re left with just products which fall within the prices of $10 or $30. As you see, nothing is − now, we’ve actually rounded here so we’ve got $30.50. We’re using a rounding up option here so we’re okay, if they fall within − that was maybe $30.70, then that would fall within $31 and not $30 so we’re rounding down to include prices within that price bracket.
TIME – 9m:38s
I find the easiest and most probably the most user-friendly option is the slider option. It’s also a lot nicer if you’re using mobile to just slide up and down rather than having to input prices. So then once you get past the price filter, we then get into our attributes, so we’re including our size attributes, our dress size. We’re not including the shoe size as an attribute. We’re including the colour, so we let customers filter by colour then we’re also including our features, compositions, styles and properties.
Once you’ve built your filter options or you’ve enabled or disabled the particular options you want included, you can also drag and drop the order of all of these so that they appear exactly how you want them within the front office. So the order you see here would be the order they appear within the front office. If I save that, that’s our template completed.
Now, you have a few more options here (see screen). We can hide filter values when no product is matching, so if there is no yellow dresses available, the yellow option will not be shown so that option is not there to show zero products. We just can’t use it, so anything which doesn’t have a product associated with it or doesn’t match, will be hidden. And you can show the number of products which match each option. So if I say that to ‘yes’ (see screen), when we go back to the front end, and if we refresh, we can now see that how many products there are within each of these choices. So if I just want the Viscose dress (see screen), there we go, just one option. I have one product available for this particular option.
TIME – 11m:19s
If we go back to the module, we can also filter depth of how many categories. This is if we just want products pulled in from the next sub-category, we would set that to a depth of just one. If there are maybe seven sub-categories associated with a category, if we set that to zero, all the products would be pulled into that page from all of the other sub-categories. So you can define the depth to which you want to filter your categories by. Again, we’ve got the branding option on our price filter (see screen) and we’ve got whether we include the tax on the price filters as well.
So that the layered navigation. It’s a great module to use. It gives customers the flexibility of being able to browse products, which fit only their criteria they’re looking for, but it’s also a quick and easy way for customers to get to the products they want without having to trawl through lots of products to find it and having to go into each product to find out what attributes or features are available for each product. So here (see screen), we would only know that this is a girly style dress. If we went to the product, we wouldn’t know that from the front office, but we can eliminate everything else by just choosing ‘girly dresses’.
I hope this has helped and if you want to post any questions or queries within the comments, please do. Please share and see you for the next tutorial on the ‘How To’.
[End of Transcript]