I love the accordion feature in divhunt, the way it is implemented gives us great design freedom with the accordion functionality.
The only thing I am missing is the ability to set the open/close state according to breakpoint and to choose if I want all the accordion loop instances to be open or closed.
Let me explain why this is usefull and how it would look…
Video explanation with examples - 3 min duration:
The way the accordion works now is great for the typical FAQ functionality. The way I am using it though, besides for FAQ’s, is to show/hide more information for various sections. You can see that in action on this site:
Scroll down a bit till you find an accordion and click on it to see how it looks and works.
At the moment I am setting all accordion loop instances to be closed by setting the ‘Opened’ setting to be higher than the amount of loops, so for example is an accordion is looped 3 times, I set the ‘Opened’ field in the settings to 4 so that all the questions (or whatever) are closed. A dedicated button for this (all open/ all closed) might be useful to avoid confusion and questions about how to do it.
I would like on a desktop resolution for all accordion instances to be open since on Desktop there is plenty of space and I do not need to tidy up information by hiding it into collpased accordions. On mobile however I would like all accordions to be collapsed as default state.
Using accordions like this is is a great way to tidy up information for small mobile screens by showing only the most important stuff by default and allowing the user to expand sections for more info where that is of interest.
I hope this is something useful for Divhunt users and that it can be implemented by the team.
If you are curious about how this would look in practice, please view the video explanation linked above.