How to create a multi-level filter with TZ Portfolio
Since TZ Portfolio+ version 2.2.5, we have already make an awesome improvement in filter section, which allows users to create a hierarchal filter displaying both primary category and sub-categories. We're well aware of the importance of how specific category levels are, so that visitors on your website can view more insights about your portfolio.
Today, I would like to share with you the way to achieve a multi-level filter with TZ Portfolio. Let's go!
I. Install TZ Portfolio+
- Install from web
- Go to Admin > Extensions > Manage > Install > Add "install from web" tab > Search for TZ Portfolio
- Click on install button
- Download from the website
- Go to http://tzportfolio.com/ and download TZ Portfolio+ component
- Go to Admin > Extensions > Manage > Install > Upload file
Create categories and sub-categories
To display the multi-level filter in the best look, you're supposed to create not only primary categories, but their sub-categories also.
- Go to Admin > Components > TZ Portfolio+ > Categories > Add new
- To create a sub-category, just add new one and assign it to a parent category
II. Create portfolio articles
You'd better create portfolio articles for each main category and sub-categories. To do that:
- Go to Admin > Components > TZ Portfolio+ > Articles > Add new
- Insert content and information, as well as configure basic options on the right side.
III. Configure filter style
In version 2.2.5, we have added a filter option with Elegant style, so you need to configure this option in elegant layout. Elegant is a style included in the core component, so there is no need to install it.
- Go to Admin > Components > TZ Portfolio+ > Layout > Elegant - Default
- Choose filter style: Drop-down
IV. Let filter show
- Go to Admin > Menus > Main Menu > Add new
- Menu item type: TZ Portfolio+ > Portfolio
- Categories: select all categories and sub-categories that are created above
- TZ Portfolio+ layout: elegant - Default (required)
In tab "Basic Options", make sure that the option "Show filter" is turned on and filter type by Categories
After all, you can have a multilevel filter displayed like this below