checkbox search filter in two columns, arranged per column

This thread is resolved. Here is a description of the problem and solution.

Problem: I have a custom search View that includes checkboxes filters. The list of checkboxes is long, and I would like to display it in multiple columns. Is there a way to set it up so that the order is top to bottom per column, then left to right by column?

Solution: This particular design feature isn't built-in to Toolset but you may be able to use custom CSS columns or column-count to flow the checkboxes list into multiple columns.

Relevant Documentation: https://css-tricks.com/guide-responsive-friendly-css-columns/

This support ticket is created 5 years, 5 months ago. There's a good chance that you are reading advice that it now obsolete.

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
8:00 – 12:00	8:00 – 12:00	8:00 – 12:00	8:00 – 12:00	8:00 – 12:00	-	-
13:00 – 17:00	13:00 – 17:00	13:00 – 17:00	13:00 – 17:00	13:00 – 17:00	-	-

Supporter timezone: America/New_York (GMT-04:00)

Tagged: Custom search, Views plugin

This topic contains 2 replies, has 2 voices.

Last updated by johnB-43 5 years, 5 months ago.

Assisted by: Christian Cox.

Author

Posts

July 9, 2019 at 1:34 pm #1287661

johnB-43

I'm trying to display checkboxes in a search filter in two columns, alphabetically. I used the solution mentioned here: https://toolset.com/forums/topic/how-to-display-a-checkbox-taxonomy-list-in-two-columns/

With this solution the options are arranged alphabetically in two columns, but in a way that goes left-right-left-right-left-right, etc. I don't think anyone reads columns this way. I'd like them arranged so I first have the options go aphabetically down the first column, and then again down the second column. Can this be done?

Thank you!

July 9, 2019 at 1:44 pm #1287671

Christian Cox

Hello, with some custom code you can use CSS columns or column-count to flow the checkboxes list into multiple columns: https://css-tricks.com/guide-responsive-friendly-css-columns/

Order will be per column, then left-right.

July 9, 2019 at 3:57 pm #1287871

johnB-43

That was easy 🙂 Thank you!