How to Use the Load More Posts Ajax Button in WordPress


To begin with, you need to install the WordPress plugin called Ajax Load More. If you are not sure how to do this, do a web search for instructions on installing WordPress plugins.
After activation, the plugin will add a brand new item in the menu called Ajax Load More to your admin menu in WordPress. Click on the link and go to the plugin’s settings page.

Once you are on the settings page for this plugin, you can choose what color you want your button to be. You can also change the button to be an infinite scroll which will load next set of posts automatically without requiring your users to click the button.

Next, you should go to Ajax Load More >> Repeater Template page and add a template for displaying posts. The plugin comes with a simple template that contains the WordPress loop to show posts but it may not match your theme so may not look very good on your website.
To solve this issue, you need to copy the WordPress code your theme uses to show posts on the index, archive, and blog pages of your website.

Usually, this code is in the template-parts folder of your theme file directory. That folder should contain templates to display different types of content. These include the files content-page.php, content-search.php, and more.

You will need to find the generic content.php template. After that code is found, you should look for the Repeater Templates field and past it in the Ajax Load More settings.
Once that is done, click on the Save Template’ button to save your settings.
Next, you should visit the Shortcode Builder page to create the shortcode. On this page you can customize lots of different options. First, you should select the type of container. If you aren’t sure, look at the template copied from earlier.

Modern themes usually use the <div>; element. Next, scroll down to the section with button labels. You can change the text that is displayed on the button here. By default, the plugin uses Older Posts’ but you can change that text to be Load more posts’ or something else you want.

Finally, you should to select if you would like posts to load automatically or if users should click on the button.

The shortcode is can now be used. In the right column, you should see the shortcode output. Copy the shortcode and paste it in your favorite text editor. Once you save the changes, go to your website to see the Load more posts’ button in action.

Add comment

Recent Posts


Recent Comments