How to Search Posts by Custom Field in Elementor?

Updated on June 24, 2024 by Editorial Team
Table Of Content

Do you want to search posts by custom field data in Elementor? Custom fields allow you to add additional information to your posts, pages, products or custom post types. By allowing users to search posts by custom field data you can improve the search result.

With the Search Bar widget from The Plus Addons for Elementor, you can easily search any post type based on custom field data.

To check the complete feature overview documentation of The Plus Addons for Elementor Search Bar widget, click here.

Requirement  – This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.

To do this, make sure you have created at least one custom field for any post type. You have to use the free Advanced Custom Fields (ACF) to create the custom field.

For instance, we’ll create a custom field called location for normal blog posts.

Then add the Search Bar widget on the page or template and follow the steps –

Create Custom Fields

Once you have the ACF plugin installed follow the steps – 

1. From the Dashboard, go to ACF > Field Groups and click on Add New button. 

2. Add a name to the field group.

3. Then add a field type and add a name. For instance, we’ll add a checkbox field with the name called Location.

4. Once done, from the Settings section set the location to Post under Rules.

Acf custom field post

5. Then click on the Save Changes button.

6. After that you have to add value in the custom fields on some posts.

Add custom field data post

Use the Search Bar Widget

Then add the Search Bar widget on the page or template.

1. Open the item under Search Bar and select Post from the Source dropdown.

2. From the Select Type dropdown, select Posts.

Search bar posts

Now, you should be able to see a dropdown beside the search bar.

Then make the necessary changes to Label, Placeholder and Show Index sections.

3. After that, go to the Standard Search tab and click on the pencil icon of ACF Filters.

4. Then in the ACF Key field, you have to add the custom field name.

To find the field name in ACF, edit the field group there you will find the field name.

Acf custom field post
Search bar acf options

Now you’ll be able to search posts by location names.

In a similar way, you can search pages, products or custom post types by custom field data.

Also, read How to Search Specific Custom Post Types in Elementor.

OR
Get Free 25+ Secrets to Make Elementor Website Faster [Guaranteed Results]



    Subscribe to our YouTube Channel for Elementor Tutorials
    New Video Every Week!
    Automatically Convert Figma Designs to 100% Editable Elementor Website

    Related Docs