Video Transcript:

If you want to add pagination to your blog main or archive page, EverWeb makes this easy to do…

In this example, I have a blog that contains 35 posts. I want my visitors to only be able to view the 25 most recent posts from the blog main page.

When viewing the blog main page I want my visitors to see the four most recent posts and have pagination available so that they can access the remaining 21 posts.

In my example, my visitors would use the blog archive page to access the full list of 35 posts.

To start, I first select the blog main page in the Web Page List and then click on the blog main widget. This widget lists the blog posts that you see displayed in the Editor Window.

In the Widget Settings, first change the ‘Total Number of Posts’ field. This sets the number of blog posts, out of my total of 35, that I want to be displayed.

In my example I only want to display the most recent 25 blog posts, so I set the value at 25. The page will update accordingly so you only see the 25 most recent posts.

Next move down to the Pagination Options section and click on the 'Show Pagination Buttons' checkbox. The Pagination Options become available.

I can now select how many of the posts from the 25 'Display Posts' I want to see at one time. In my example I am going to set the 'Posts Per Page' to four.

At the bottom of the blog main widget, the pagination buttons display.

Note that the value of the ‘Total Number of Posts’ field must be less than or equal to the number of actual posts you have created in the 'posts' page.

In addition, the ‘Posts per Page’ value must always be at least 2 less than the 'Total Number of Posts' field for the pagination buttons to display.

The Editor Window will update so that I now only see 4 posts per page. As I have 25 posts that I want to display, the pagination buttons update to show numbered buttons 1, 2, 3, 4 and 5.

I can now set the other Pagination options to color the currently selected button's background color, the background color of the buttons that are currently disabled and the background color of the numbered buttons.

The buttons can be made rectangular by setting the 'Border Radius' to zero. The maximum value of 50 will make the buttons appear elliptical.

If you want to change the font and font size and style of the pagination buttons, simply double click on the pagination buttons in the Editor Window. The whole row will become highlighted.

Next, click on the Fonts button in the Toolbar and change the font and font size as you want using the Fonts Panel options.

Preview your blog main page before publishing…