How to Add It to Your Website

Want to add infinite scroll in WordPress?

Infinite scroll ensures that your pages automatically load new content every time a visitor reaches the bottom of a page. In this way, you can keep your visitors engaged and reduce your site’s bounce rates.

💡 We will show you how to add infinite scroll to your WordPress website. But first, we will touch upon a few basic things you should know about it. The outline of this post is as follows:

Let’s get started.

With infinite scroll, your site loads new content as a user scrolls down, rather than requiring them to click on a link manually to open a new page.

On WordPress, a common example would be to load new posts automatically on your blog page once the visitor reaches the bottom, rather than relying on other techniques such as pagination.

The technique is often used on social media platforms like Facebook and Twitter to offer users an unhindered browsing experience.

Should you add infinite scroll on your site? Pros and cons

Despite the positive impact it can have on user engagement and browsing experience, infinite scrolling is not for everybody.

Let’s take a look at 🔎 the pros and cons to decide if you need to implement the technique on your WordPress website.

👍 Pros of using infinite scroll

The advantages of using the infinite scroll on your site are:

👎 Cons of using infinite scroll

The disadvantages of using the infinite scroll on your site are:

• It can be confusing to navigate your site as the content seamlessly changes and it’s hard to know what page you are on.
• Continuous display of content, especially text, can be overwhelming for some visitors and they may choose to leave your site and seek a competitor site.
• Your site’s footer will become redundant because the visitor can never reach it.
• Fast scrolling can overwhelm your web servers causing your site to freeze up and crash.
• Some tools may find it hard to track metrics per page because infinite scroll can make your website seem like one big page.
• And if your site is viewed as one continuous page, then it might negatively impact the site’s SEO and search ranking. Properly implemented infinite scrolling can avoid this, though, by still giving each page its own unique URL.

These are the pros and cons of implementing infinite scroll on your website. After considering these, if you still want to add infinite scroll to your WordPress site, then read on.

There are two different ways in which you can add infinite scrolling to your WordPress site:

1. Use a WordPress theme that supports infinite scroll
2. Use an infinite scroll plugin

Let’s dive into each method and you can implement the one that suits you.

But before you start, take a backup of your entire website because implementing infinite scroll will require you to change your theme and install a new plugin into your site. Carrying out these steps involves a certain amount of risk and you may find your site broken due to a single misstep. In such cases, the backup will be your safety net so take a backup.

1. Add infinite scroll using WordPress theme (Neve)

Neve is one of the few free WordPress themes that offer the infinite scroll function. It’s an ideal solution if you wish to enable infinite scroll only on your blog listing page (or other archive pages).

Enabling infinite scroll using Neve is super easy.

Install and activate the theme on your WordPress website.

Then go to Appearance → Customize → Layout → Blog / Archive.

Scroll down to the Ordering and Content option and select Infinite Scroll under Post Pagination.

Hit the Publish button to save your setting.

However, if you want to enable infinite scroll on your individual posts or pages, you need to use a plugin. That is, when someone opens the full single blog post page and scrolls to the bottom, you want your site to load another full post.

In the next two sections, we will show you how to use plugins to implement infinite scrolling. 👇

2. Use a WordPress infinite scroll plugin

There are a number of plugins that will help you enable infinite scrolling on your website, but the most popular ones are:

1. Catch Infinite Scroll
2. YITH Infinite Scrolling
3. Ajax Load More

Let’s take a quick look at each plugin before showing you how to use them.

Catch Infinite Scroll

Catch Infinite Scroll is a simple and free infinite scroll plugin that allows you to display your site’s content horizontally on a single page.

If you change the trigger to click instead of scrolling, it will add a Load More button on your site.

Customization is possible and you can choose to change the load image and the color, font size, and font family on the Load More button, among other things.

The free version allows you to enable infinite scroll on your website. However, to be able to change color, font family, and font size, you need to get the premium version for an annual fee of $24.99.

To use the free plugin, all you need to do is install and activate the plugin on your site and you are good to go.

By going to Catch Infinite Scroll on your WordPress dashboard, you can upload a new load image, and change the Load More text and the text that would appear when there is no more content to show.

YITH Infinite Scrolling

YITH Infinite Scrolling is a free plugin and like the previous plugin, YITH Infinite Scrolling also offers options to choose your pagination type – infinite scrolling or load more button.

You are allowed to change the Load More button text, add extra classes to the button and even use animations (like fade in, slide in) for loading new content.

There are a number of load images to choose from along with the option to upload your own.

Two of our favorite features are the option to enable or disable infinite scrolling on mobile devices and to change the URL of a page whenever new items are loaded (important for SEO).

With the free version of the plugin, you are allowed to do only two things:

1. Upload a custom loading image.
2. Enable infinite scrolling only on your post.

To enable infinite scrolling on all your archive pages and access every feature of the plugin, you need the premium version of the plugin which costs $59.99 per year.

Using YITH Infinite Scrolling is quite easy. Just install and activate the free plugin on your site, and it will enable infinite scrolling on your posts.

You can navigate to YITH → Infinite Scrolling to customize the plugin configuration, but the default settings work just fine.

Ajax Load More

Ajax Load More is a complex plugin that allows you to enable infinite scroll along with options like AJAX filtering, repeater templates, shortcode builder, custom inquiries, etc.

Compared to the previous plugins, Ajax Load More is a bit more complicated to set up. While you don’t need to be a developer to use it, beginners might want to stick with a different plugin because you’ll need to deal with terms like “query parameters” and “repeater templates.”

However, the advantage of that added complexity is that you get a ton of options for configuring and customizing the infinite scroll behavior on your site.

So if you want to be able to infinite scroll everything on your site, from posts to pages, comments, and more, this could be a good option to look at.

Get started with WordPress infinite scrolling

For some other ways to improve your site, 👉 check out our seven tips to improve user experience.

That’s all for this one! If you have any questions about how to add infinite scroll on a WordPress site, let us know in the comments below.