Do you want to display posts from a specific category using the Blog Listing widget in Elementor? With the help of AJAX filters from The Plus Addons for Elementor, you can easily show category-based posts from all available posts, not just the ones currently visible on the page.
When you use AJAX filtering, it searches through your entire post list, even if you’re only showing a few posts at first. This makes it easier for visitors to find what they’re looking for and ensures your filters work more accurately. In this guide, we’ll explain how AJAX filtering works and how it improves the post display experience on your site.
To check the complete feature overview documentation of The Plus Addons for Elementor Blog Listing widget, click here.
Requirement – This widget is a part of The Plus Addons for Elementor. Make sure it’s installed & activated to enjoy all its powers.
First, you need to create some posts under any custom post type to display them, then follow the steps –
1. Add the Blog Listing widget to a page or template.
2. Then, go to the Layout tab and select Normal Page from the Post Listing Types dropdown.
3. After that, select the appropriate Style and Layout.
Note: To see the AJAX Filter effect, you need to enter a number lower than the total number of posts in the Maximum Posts Display section under the Content Source tab. I.e., 3 here,
4. Then, go to the Category Wise Filter tab and enable the Category Wise Filter toggle.
5. After that, select the AJAX option from the Filter Type dropdown.
Note: You need to understand how the AJAX option actually works. Please see the steps below.
Let’s first start with the Normal type
Normal Filter Type:
When you choose the Normal option from the Filter Type dropdown and set the Maximum Posts Display to 3 under the Content Source tab, even if you have a total of 8 posts, the filter will only apply to the 3 posts that are currently displayed.
So, if you select a specific category on your page, it will search for matching posts only within those 3 displayed posts, not from all 8 posts.
Example:
- Total Posts: 8
- Max Posts Display: 3
- Selected Category: Team-oriented upward-trending implementation
- Result: It will only filter from the 3 visible posts and show the ones that belong to the Team-oriented upward-trending implementation category (if any).
Then move to the AJAX type.
AJAX Filter Type:
When you choose the AJAX option from the Filter Type dropdown and set the Maximum Posts Display to 3 under the Content Source tab, even though only 3 posts are shown at first, the filter will search through all 8 total posts, not just the ones currently displayed.
So, when you select a specific category on your page, it will filter from the entire list of 8 posts and then display the ones that match your selected category.
Example:
- Total Posts: 8
- Max Posts Display: 3
- Selected Category: Team-oriented upward-trending implementation
- Result: It will filter from all 8 posts and show the Team-oriented upward-trending implementation category posts (up to 3, based on your display limit).
Now, you’ll see the posts from your selected category on this page.
