---
title: "How to Add Ajax Load More Button to Search Results in WordPress?"
url: https://nexterwp.com/docs/add-ajax-load-more-button-to-search-results-in-wordpress/
date: 2024-12-02
modified: 2026-04-14
author: "Aditya Sharma"
description: "When you've got a ton of content, displaying all of it in search results can slow things down. A \"Load More\" button can solve this by showing a few results..."
image: https://nexterwp.com/wp-content/uploads/2024/12/How-to-Add-Ajax-Load-More-Button-to-Search-Results-in-WordPress_-1024x519.jpg
word_count: 355
---

# How to Add Ajax Load More Button to Search Results in WordPress?

## Key Takeaways

- Nexter Blocks includes a Search Bar block that allows users to add a load more button to Ajax search results.
- Users can customize the button text and loading text in the Search Bar block's settings.
- The Posts Per Page setting must be lower than the total number of search result items to display the load more button.

When you've got a ton of content, displaying all of it in search results can slow things down. A "Load More" button can solve this by showing a few results first, and users can click to reveal more. 

With the Search Bar block from the Nexter Blocks, you can easily add a load more button to the Ajax search result.

*To check the complete feature overview documentation of the Nexter Blocks Search Bar* block, [click here](https://nexterwp.com/docs/add-a-search-bar-in-wordpress/).

***Requirement  - This block is a part of the Nexter Blocks, make sure it's installed & activated to enjoy all its powers.***

[LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/builder/wordpress-ajax-search-bar/)

To do this, add the Search Bar block on the page or template and follow the steps -

1. Select the appropriate source and type for search.

2. Now go to **Extra Option** tab and enable the **AJAX Search** toggle.

![](https://nexterwp.com/wp-content/uploads/2024/12/searchbar-ajax-search-10.png)

3. Then go to the **Load More/Lazy Load** tab and select **Load More** from the **Loading Options** dropdown.

![](https://nexterwp.com/wp-content/uploads/2024/12/searchbar-load-more.png)

From the **Button Text** field, you can change the text on the button, while the **Loading Text** field allows you to change the text that appears when more items are being loaded. Additionally, you can also modify the text that appears when all items are loaded by using the **All Posts Loaded Text** field.

Then, from the **More Post On Click/Scroll** field, you can set how many items will load at once on the button click.

By turning on the **Counter** toggle, you can show a counter for the number of pages and from the **Counter Text** field, you can change the section text.

4. After that, go to the **Results Area** tab, and from the **Posts Per Page** section, you can set how many items will load in the initial search result.

![](https://nexterwp.com/wp-content/uploads/2024/12/searchbar-result-area-post-per-page-1.png)

Depending on the total number of items and the number set in the **Posts Per Page** field, you’ll see a load more button when you make a search which you can use to load more results.

> *Note: To show a load more button, you must set a lower number in the ****Posts Per Page**** field than the total number of search result items.*

![](https://nexterwp.com/wp-content/uploads/2024/12/searchbar-load-more-demo-1.gif)

## Frequently Asked Questions

**Q: What if the Load More button doesn't appear in my search results?**
A: The Load More button will only show if the number of posts set in the 'Posts Per Page' section is lower than the total number of search results. If you don't see the button, check this setting to ensure it allows for more results to load. Adjusting this number is crucial for the button's functionality.

**Q: What are the best settings for using the Load More button effectively?**
A: For optimal performance, set the 'Posts Per Page' to a number that is significantly lower than the total search results. This ensures users can load more items without overwhelming the page. Additionally, consider enabling the counter toggle to provide users with feedback on how many results remain, which can improve navigation.

**Q: Does the Ajax Load More button work with other blocks in Nexter Blocks?**
A: The Ajax Load More button is specifically designed to work with the Search Bar block in Nexter Blocks. This integration allows for a seamless user experience when searching through large amounts of content. If you are using other blocks, ensure they support similar functionality for consistent behavior.

**Q: What happens if I set the number of posts to load initially too high?**
A: If you set the 'Posts Per Page' to a number equal to or greater than the total search results, the Load More button will not appear. This could lead to a less interactive experience for users, as they wonu2019t have the option to load additional content. Adjust this setting to enhance user engagement.