How to Add Next & Previous Pagination Widget to Blogger? free

Pagination or Previous and Next Pages numbering widget for blogger blogs is almost a great widget. You can add it to your blog easily and just with few steps. As many bloggers search for this trick that how to paginate their blog by using the quickest and easiest method. Pagination is a good method to engage visitors within your blog. So if want to include previous and next buttons along with page numbers then you are here to do so.

The widget is designed with CSS and the functionality is from JavaScript. So you will just need to add it somewhere on your blog template; apparently, you can add this widget by using your blog’s Layout page and add an HTML/JavaScript widget and straight paste the given code [on this page] inside that. The widget won’t affect your blog’s loading speed because of using few codes of JavaScript. So now follow the given steps to add this pagination widget to your blog.

How to add Pagination widget to Blog?

Following simple steps are for you in order to add this cool widget to your blogger blog. So follow them and enjoy the widget.

• Log-in to Blogger Dashboard
• Go to Layout
• Add a Widget
• Add HTML/JavaScript Widget
• Copy Below code and paste inside HTML/JavaScript widget

<style type=”text/css”>
#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea a{color:#000;text-shadow:0 1px 2px #fff;font-weight:normal}.showpageNum a{padding:2px 8px;margin:0 4px;text-decoration:none;border-bottom:2px solid #5fb404;border-top:2px solid #5fb404;background:#effbf5}.showpageNum a:hover{border-bottom:2px solid #df01d7;background:#a9f5f2;border-top:2px solid #df01d7}.showpageOf{margin:0 4px 0 0}.showpagePoint{color:#fff;text-shadow:0 1px 2px #333;padding:2px 8px;margin:2px;font-weight:700;border-bottom:2px solid #5e610b;border-top:2px solid #5e610b;background:#5e610b;text-decoration:none}
</style>
<script style=’text/javascript’>
var postperpage=3; var numshowpage=3; var upPageWord=”Prev”; var downPageWord=”Next”; var home_page=”/”; var urlactivepage=location.href;
</script>
<script style=’text/javascript’ src=’http://safir85.ucoz.com/24work-blogspot/page-navigation/0-test-p-n-01_00.js’>
</script>

Save the widget and view your blog for a live pagination widget with number of pages and next/Previous buttons.

Customization 

In the bolder codes above you can change the number of pages to show fromnumshowpage=3 to any value you want, also you can  change the text Prev and Next to any value you want.