Skip Navigation

[Resolved] Customize Checkbox Inputs in custom searches

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

Problem

How can I customize the Custom Search (Checkboxes, for exmaple) so they look like an image to be checked, instead of the default checkbox?

Solution

In Toolset Custom Searches, you can manipulate exactly only what you see in the GUI "New Filter" or "Edit Filter".

We offer a few versions of filters (SingleSelect, MultiSelect, Radio, Text and Checkboxes.

These are basic HTML elements, with which all kind of Lists or Inputs is created, hence it's a matter of styling.

This support ticket is created 6 years, 8 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.

No supporters are available to work today on Toolset forum. Feel free to create tickets and we will handle it as soon as we are online. Thank you for your understanding.

Sun Mon Tue Wed Thu Fri Sat
- - 14:00 – 20:00 14:00 – 20:00 14:00 – 20:00 14:00 – 20:00 14:00 – 20:00
- - - - - - -

Supporter timezone: Asia/Ho_Chi_Minh (GMT+07:00)

This topic contains 1 reply, has 2 voices.

Last updated by Beda 6 years, 8 months ago.

Assisted by: Beda.

Author
Posts
#625747
filters.PNG

Rather than a dropdown parametric search. I was wondering if it was possible to have horizontal filters that filter a grid of posts. And if so what are the settings for this (or docs)

See screenshot and link of an example of this from the current theme I am using

hidden link

Thanks!

#625842

In Toolset Custom Searches, you can manipulate exactly only what you see in the GUI "New Filter" or "Edit Filter".

We offer a few versions of filters (SingleSelect, MultiSelect, Radio, Text and Checkboxes.
These are basic HTML elements, with which all kind of Lists or Inputs is created, after all. It's a matter of styling.

For example, you can set the Filter to be as "Checkboxes" and then style those in a way that makes the Checkboxes appear as images that you select.
See the (ugly) example here:
hidden link
See the Top 4 Icons?
Those are Input HTML elements from a View Search but customized with CSS.

This is basically the same that you will do to achieve your goal here.
You will set a minimal output method (for example checkboxes or radio), and choose to use the "raw" style output, instead of the "Fully styled output".
Then, after you inserted this filter you will be able to apply CSS to hide the actual boxes and leave only the labels, and put them inline as well

This requires Custom CSS, something that we cannot offer here, but with this above info, and this tutorial, I think you are good to go:
hidden link