This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.
Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.
| Sun | Mon | Tue | Wed | Thu | Fri | Sat |
|---|---|---|---|---|---|---|
| - | 9:00 – 13:00 | 9:00 – 13:00 | 9:00 – 13:00 | 9:00 – 13:00 | 9:00 – 13:00 | - |
| - | 14:00 – 18:00 | 14:00 – 18:00 | 14:00 – 18:00 | 14:00 – 18:00 | 14:00 – 18:00 | - |
Supporter timezone: Asia/Hong_Kong (GMT+08:00)
This topic contains 2 replies, has 2 voices.
Last updated by 1 year, 10 months ago.
Assisted by: Luo Yang.
I have created a home archive where I have added a taxonomy query as set of checkboxes. But the taxonomy has a lot of terms. I want to make the terms collapsible. I don't want to use Select Multiple Or Select Dropdown option as they don't have checkboxes.
I want to add an arrow icon beside the text 'Purpose'. Users will click on that icon to reveal or hide the terms.
How can I make the set of checkboxes collapsible?
Hello,
It is possible with custom CSS/JS codes, see below sandbox website:
Login URL: hidden link
Post view with search form:
hidden link
1) Find and select the 'Purpose' taxonomy Custom Search Filter, in the block setting panel, option "CSS CLASSES", add a CSS class name: wpv-purpose, see my screenshot css-class3.jpg
2) Find and select the view block, in the block setting panel, in the "Custom CSS" option, use below CSS codes:
label[for="purpose"]::after{
content: ">";
}
.wpv-purpose span.wpv-custom-search-filter__input{
display:none;
}
in the "Custom JS" option, use below JS codes:
jQuery('label[for="purpose"]').click(function(){
jQuery('.wpv-purpose span.wpv-custom-search-filter__input').toggle();
});
See the result here:
hidden link
