Tutorial Stats

How to Create Blog Pagination for Your Weebly Blog Pages​

Posted By Chris, Weebly Web Designer & Front-End Developer
October 18, 2019
Tutorial Description
Blog pagination is a numbered navigation that appears at the bottom of a blog page.

The purpose of blog pagination is to allow more efficient navigation between blog pages. Instead of only being able to move from page 1 to page 2 in a single click, you can instead move from page 1 to page 3, or even the last page, in a single click.

Weebly's currently pagination setup on their blog pages is stale, to say the last. It consists of a simple "<<Forward" and "Previous>>" pagination, which don't even appear on the correct side of the blog.

An example for how the blog pagination in this tutorial works: if you're on page 3 of your blog, at the bottom of this page, your blog pagination will consist of, from left to right, "First Previous 1 2 3 4 5 Next Last".

At the moment, the blog pagination in this tutorial will not work for "category" or "archive" blog pages, but will instead simply show "Previous" and "Next".

The blog pagination in this tutorial will not show within the Weebly editor. Once this blog pagination is installed, in the Weebly editor, the blog pagination will simply show as "Previous" and "Next".

Blog pagination is typically a website function reserved for back-end script codes, such as PHP. Since Weebly does not currently allow its users access to the back-end of the website, the blog pagination in this tutorial uses a front-end script code known as jQuery.

Since the blog pagination in this tutorial is using jQuery, every time your page is loaded, the jQuery will scan your entire blog to determine how many pages it has. This means that if you have a lot of blog pages, there could be a bit of a delay (i.e., less than a second -- barely noticeable) before the "Last" component of the pagination is operable since the jQuery is scanning all of the pages.

The blog pagination will automatically detect if a blog page is being viewed, and if so, it'll grab the URL of the page, scan the total blog pages, and then display itself. This means the blog pagination will work on all of your Weebly blog pages automatically. The codes below only need to be added to a site once.

Widget Powered by Editor Tricks
Need Help Installing This Tutorial?
· Closes 5 PM
· Opens 7 AM