Add Charge To A Greater Extent Than Posts Or Interplanetary Space Scrolling To Blogger

You mightiness convey seen the implementation of interplanetary space scrolling at Facebook, Twitter or Google+. Instead of showing Older / Newer posts links, nosotros tin charge posts dynamically whenever a "Load to a greater extent than posts" clitoris is clicked, or yesteryear scrolling downwards the page. This tutorial volition exhibit yous how to implement Ajax based loading script that volition add together Load More Posts or Infinite Scrolling to Blogger, then that visitors tin easily navigate without reloading the page.

How it works?

- You convey the pick to add together a 'Load More Posts' clitoris or charge automatically the older posts every bit visitors scroll downwards the page.
- Once implemented, Load More Posts / Infinite Scrolling applies to all Blogger posts on index pages (homepage, archive, label pages). It can't last added on private posts.

Demo

To run into it live, banking corporation fit out the demo below. When yous scroll downwards to the bottom of the page, yous volition run into the "Load More Posts" button. Once yous click it, the side yesteryear side iii posts laid to display volition charge below.

You mightiness convey seen the implementation of interplanetary space scrolling at Facebook Add Load More Posts or Infinite Scrolling to Blogger



Adding Load More Posts or Infinite Scrolling to Blogger

1. Log into your Blogger account in addition to click on your weblog where yous desire to add together it.
2. Go to 'Theme' in addition to click the 'Edit HTML' clitoris to opened upwards the Template editor > click anywhere inwards the code surface area in addition to press CTRL + F keys (or Command + F) to opened upwards the search box.



3. Type the tag below inwards the search box in addition to press ENTER to honor it:
4. Just inwards a higher identify the tag, add together the script below:

a. If yous desire to charge posts amongst 'Load More Posts' clitoris similar inwards the demo blog, add together this script:


b. If yous desire to add together the interplanetary space scrolling without button, glue this instead:


Note: This code uses jQuery library, then if yous already convey jQuery on your page, delight take the business inwards ruby highlighted above.

5. Click 'Save template' clitoris in addition to banking corporation fit the 'Load More Posts' clitoris / Infinite Scrolling inwards your Blogger blog.

Conclusion

That's it! So this is how nosotros tin easily add together Load More Posts / Infinite Scrolling to Blogger. From instantly on, our visitors tin remain inwards same page in addition to navigate through interplanetary space discover of posts on the fly!