Example Description
In this example, we simulated a multi-select dropdown menu with checkboxes that lets visitors search site content using more than one filter option at a time. Users select multiple continents and all matching countries are displayed on the page.
How We Built It
We used our Search a Database example site as the basis for this example.
Page Elements
The Search a Database example includes a repeater, dataset, and dropdown filter. In this example, in order to create our customized dropdown, we replaced the dropdown element with the following page elements:
-
A container box with a down arrow image that looks like a dropdown.
-
A text element inside the container box. The default text defined in the Editor is "Filter search by Continents."
-
A repeater for the part that "drops down". Each repeater item contains a checkbox and text for the name of a continent. This is where the user makes multiple selections.
Related Examples
Did this help?
|
Thanks for your feedback!
![Search a Database](https://static.wixstatic.com/media/f0504e_4e1433fc7d5f412585302f64b58187ee~mv2.jpg/v1/fill/w_79,h_52,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_auto/Image%20placeholder.jpg)
Search a Database
Let visitors quickly search your site content.
![Intermediate.png](https://static.wixstatic.com/media/12d367_3e4cb40eaf29447896e3ccdc94a766e5~mv2.png/v1/fill/w_10,h_9,al_c,q_85,blur_3,enc_auto/Intermediate.png)
Intermediate
![Dynamic Slideshow](https://static.wixstatic.com/media/f0504e_be4e79856bcd4a438ac189196f5c57f9~mv2.jpg/v1/fill/w_79,h_52,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_auto/Image%20placeholder.jpg)
Dynamic Slideshow
Populate a slideshow with database content.
![Intermediate.png](https://static.wixstatic.com/media/12d367_3e4cb40eaf29447896e3ccdc94a766e5~mv2.png/v1/fill/w_10,h_9,al_c,q_85,blur_3,enc_auto/Intermediate.png)
Intermediate
![Dropdown Custom Element](https://static.wixstatic.com/media/f0504e_ddb4ccb769fa45428020c76e9e768104~mv2.png/v1/fill/w_79,h_52,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/Image%20placeholder.png)
Dropdown Custom Element
Create a dropdown with text and images using a custom element.
![Intermediate.png](https://static.wixstatic.com/media/12d367_3e4cb40eaf29447896e3ccdc94a766e5~mv2.png/v1/fill/w_10,h_9,al_c,q_85,blur_3,enc_auto/Intermediate.png)
Advanced