How to add infinite scrolling on a WordPress and squarespace infinite scroll

Would you like to add infinite scrolling on WordPress and Squarespace infinite scroll and other plugin?

Is there anything more addicting than Facebook’s news feed? I mean, I’m sitting here writing this tutorial, but this addicting feature just keeps scrolling… again… and again.

This is a feature that Facebook uses, which is called ” infinite scroll ” or ” endless scroll” , for the news feed. Rather than having to click a button or ” Next ” or ” Read More “, the content keeps loading as you scroll down the page.

And guess what? You can achieve the same effect on your WordPress blog by adding infinite scrolling.

In this tutorial, I’m going to discuss some of the pros and cons of infinite scrolling and then I’ll show you how to set up infinite scrolling on your WordPress blog.

Benefits of infinite scrolling

Many big brands have experimented with infinite scrolling, which gives us the advantage of being able to examine their data. Here are some of the benefits that have been experienced by social networks:

I can’t say for sure that you will get the same results as these top brands, but if you have a lot of blog posts, scrolling will definitely be a good option.

Most social networks rely on infinite scrolling for these same reasons.

Cons with infinite scrolling

Everything is not always rosy with the infinite scrolling. There are definitely a few potential negatives you should consider:

Also, in the “Benefits” section, the infinite scrolling is good when you have a lot of equally important blog posts. Well, the opposite is also true:

How to add infinite scrolling in WordPress

To add infinite scrolling on WordPress, you can use a free plugin named ” Ajax Loader More “. This plugin has tons of premium extensions that can boost its functionality, but the free version should be enough to just add infinite scrolling to your website.

The basic plugin works by generating a shortcode that you add to a page. This page then displays your blog posts in an infinite scroll. There are a few other small steps, which you will also need to complete along the way. Here’s how to put it all together:

Plugin installation and configuration

You can find “ Ajax Loader More ” on the WordPress plugin directory. Install and activate the plugin as you would any other plugin.

Once it’s activated, you will see a brand new “ Ajax Load More ” option . Go to ” Ajax Load More> → Repeater Template ” to create your template.

” Your Template > Repeater ” is the template that defines how articles should display in infinite scrolling. You can change it, but you need to know a bit of PHP. However, the default template should be fine for most users:

The only important thing to note is that the default “Repeater” template will only show article excerpts, not full articles. If you want to display full articles, you must replace ” the_excerpt () ” with ” the_content () “.

If you are familiar with PHP, you will be able to further customize this template. Otherwise, it’s fine to leave the default “ Repeater ” template .

There is a lot of stuff you can configure here. You have the option to change what will show in the infinite scroll and how it will all behave.

I can’t cite all of the possibilities in this article, but here are some of the boxes you’ll definitely want to fill out:

Once you’ve configured everything, copy the shortcode to the right side of the page:

All you need to do is add this shortcode to the page where you want your infinite scroll to appear. For example, you can add it to a page called “ Blog ” to make it your default blog page.

Read more on website maintenance

How it squarespace infinite scroll works?

  • Infinite Scroll is only available in Blog Pages in the templates listed above.
  • If enabled, Infinite Scroll applies to all Blog Pages on a site. It can’t be set per individual Blog Page.
  • Infinite Scroll automatically loads posts as visitors scroll down the page.
  • Infinite Scroll will continue loading content until all of the page’s content is on the page.
  • If a visitor scrolls quickly or is on a slower connection, there may be a slight delay in load time.

How to enable infinite scroll in Squarespace?

To enable Squarespace Infinite Scroll, open a Blog Page on your site. Go to the Home Menu, click Design, and then click Site Styles.

  • Farro family – Scroll to the Blog List: Load section and choose Method: Infinite Scroll.
  • Skye family – Scroll to the Blog Grid Options section and check Infinite Scroll.

When you’ve finished, click Save.

How to disable Squarespace infinite scroll?

  • Farro family – In the Blog List: Load section of Site Styles, choose Method: Button.
  • Skye family – In the Blog Grid Options section of Site Styles, uncheck Infinite Scroll

When visitors scroll to the end of the loaded content, they can click Load More to view the next set of blog posts.

Feel free to comment down below 🙂

Also read: Squarespace alternatives

Leave a Reply