fbpx

50% Off Limited Time Offer

Days
Hrs
Min
Sec

Need Help?

Here are some good places you cant start.

Whats New?

Get updated about all the good stuff!

wordpress-black-friday-deals
Two Colors Heading
ue update blog

How to Add a Checkbox Filter in Elementor (Step-by-Step Guide)

Use the Checkbox Filter widget with any of our Post widgets to help users filter the content on your Elementor page. By allowing users to select multiple criteria at once, these filters simplify navigation and make it easy to find specific items, content, or services. Whether for narrowing down products in an online store, searching job listings, or finding movies on a streaming site, checkbox filters give users the control they need to make more refined searches quickly, enhancing their overall experience.

Popular Use Cases for the Checkbox Filter

1

E-commerce Product Filtering

Use checkboxes filter on your e-commerce website to help users narrow down products by category, attributes (such as color or brand), price, and availability, making it easier to find specific items.

2

Blog and News Websites

Allow users to find articles by topics (e.g., politics or tech), content type (such as videos), and publication dates using checkbox filters, ensuring quick access to relevant information.

3

Movies Website Filtering

On a movies website, checkboxes filter let users select genres (such as action, comedy, or thriller), movie ratings (e.g., PG-13, R), release years, languages, and streaming platforms.

4

Travel Booking Websites

Use checkbox filters on your travel website to filter by amenities (e.g., Wi-Fi or breakfast included), room types, and transport options, helping users find accommodations that meet their needs.

5

Education or Course Platforms

Checkbox filters allow users to sort courses by level, duration, and certification options, enabling them to quickly find courses that align with their learning goals.

6

Real Estate Website

Use checkbox filters on a real estate website to let users easily refine property searches by selecting criteria such as property type, price range, and amenities.

Step #1: Install and activate Unlimited Elements

Before getting started you will need to purchase Unlimited Elements pro from the link below to access the Checkboxes Filter widget.

Then follow these steps:

1

Go to Plugins → Add New → Upload Plugin.

2

Choose the zip file you downloaded, upload, and then click Activate.

3

Once activated, you’ll need to enter your license key.

Now that you have the plugin installed, it’s time to start creating the Checkboxes Filter.

Step #2: Adding the Checkboxes Filter widget to your Elementor website

To create a Checkboxes Filter you need to install the Checkboxes Filter widget from the Unlimited Elements Widget library. 

1

Go to Unlimited Elements in the WordPress Dashboard

2

Search for the "Checkboxes Filter"

3

Hover over the widget and click install

This filter can work with other filters from the widget library, such as the ‘Tabs Filter,’ ‘Search Filter,’ ‘Active Filter,’ and more. For more information, visit our filters demo page.

Step #3: Add a widget for filtering

Before we begin, we need to add the ‘Post List’ widget to display our custom posts. The checkboxes filter integrates seamlessly with various widget types, including ‘Post Widgets,’ ‘Loop Widgets,’ ‘Woo Widgets,’ and more. 

Once the Post List widget is added, select the desired post type in the ‘Posts Query’ option. Later, we will select the same post type in ‘Terms Selection’ for the checkboxes filter.

Step #4: Add the Checkbox filter to your Elementor page

Now, in the Elementor editor, Find the Checkboxes Filter widget and drag it to the desired part of your page.

Configure the Checkboxes Filter Settings

1

Sync to Posts Widget After Load

This will detect which taxonomies are used in the post widget and list them in the filter accordingly.

2

Override Query Terms

The filter will override the terms selected in the post query of the post widget.

3

Filter Logic

Set the filter logic (and/or) to change the behaviour.

4

Filter Role

Filter role let's you setup advanced multi-level filters for multiple use cases.

Terms Selection

1

Select Post Type

Select the same post type that we chose for the Post List widget in the 'Posts Query' settings.

2

Select Taxonomy

Choose the taxonomy accordingly.

3

Include / Exclude By

Include and exclude taxonomies by specific terms or set up advanced rules such as children of, current post terms, term meta, and much more.

4

Max Number of Terms

Set the maximum number of terms to display.

Other Options

1

Loader Type

Select the loader type to either "Grayed Tabs" or "Hidden Filter".

2

Title

Give it a filter title if needed.

3

Post Count

We can also show posts count with the terms.

4

See More Button

Use this to add a "See More" button to load more terms.

5

Clear Button

Enable this to also add a clear button to clear filter selection.

6

Layout

Select the layout type to either "Checkboxes" or "Accordion". The accordion can show as dropdown as well.

Wrapping it Up!

Incorporating a Checkboxes Filter on your Elementor website can significantly boost user engagement and satisfaction by offering a seamless browsing experience. With the ability to refine searches across various attributes, visitors can find what they’re looking for faster and with less effort. As a result, checkbox filters not only help organize vast amounts of content but also keep users coming back, knowing they can easily find exactly what they need.

View More Related Blog Posts

Grab this deal
before it's gone!

Days
Hrs
Min
Sec

30-Day Money-Back Guarantee

Download is just a click away

Get instant access to tons of Elementor goodies, completely FREE!

Hurray!

You got FREE access to the worlds leading widgets for Elementor page builder!