Making JetSmartFilters Expandable and Vice Versa
Collapsing/expanding filters is a case that requires a custom solution. Therefore, it is advised to use Crocoblock products in the first place. In this quick-fix article, you'll find two methods to make JetSmartFilters expandable.
Before you start, check the tutorial requirements:
- Elementor (Free version)
- JetSmartFilters plugin installed and activated
with created filters.
- JetTabs plugin installed and activated
with the Classic Accordion widget enabled.
Using Accordion Widget
Classic Accordion is a JetTabs widget that lets you display the website content compactly. In addition to text sections, you can also put smart filters into this widget.
Learn more about the Accordion widget in the How to display content in the form of a compact accordion tutorial. Please stick to the steps you find there.
Use the HTML Code
Add the HTML element block to the page where you want to expand/collapse smart filters. Then paste the following code into it:
Please note that you can modify the line “content: “˅”;” in case you want the arrow icon to point up.
To get more details, follow this How To Make A JetSmartFilters Toggle Easily guide.