Add Pagination in Blogger

We know that the tool pagination now become of the most important tools used by every blogger in his blog, and today to add this tool very easy and one step you can add to your blog color is very beautiful and I use it because of the lightness and without changes to the template.

1.  Go to your blog
2.  Jump to layout >> then Add a Gadget  >>  and choose HTML JavaScript
3.  Put the code form and we leave the title blank, and then drag it to under blog posts 

<style type="text/css">

#blog-pager{padding:5px 0 !important;}

.showpageArea {font-weight: bold;margin:5px;}/* www.bloggertricksandtoolz.com*/

.showpageArea a {text-decoration:underline;color: #fff;}/* www.bloggertricksandtoolz.com */

.showpageNum a, .showpage a {color: #fff;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;margin:0 3px;padding:3px 5px; background: #9dd53a; background: -moz-linear-gradient(top, #9dd53a 0%, #a1d54f 50%, #80c217 51%, #7cbc0a 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9dd53a), color-stop(50%,#a1d54f), color-stop(51%,#80c217), color-stop(100%,#7cbc0a)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a', endColorstr='#7cbc0a',GradientType=0 ); }/* www.bloggertricksandtoolz.com*/

.showpageNum a:hover, .showpage a:hover {border: 1px solid #ccc; background: #6db3f2; background: -moz-linear-gradient(top, #6db3f2 0%, #54a3ee 50%, #3690f0 51%, #1e69de 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6db3f2), color-stop(50%,#54a3ee), color-stop(51%,#3690f0), color-stop(100%,#1e69de)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6db3f2', endColorstr='#1e69de',GradientType=0 ); } /* www.bloggertricksandtoolz.com*/

.showpagePoint {color: #aaaaaa;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px; margin:0 3px;padding:3px 5px; background: #e2e2e2; background: -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb), color-stop(51%,#d1d1d1), color-stop(100%,#fefefe)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe',GradientType=0 ); }/* www.bloggertricksandtoolz.com*/

.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}/* www.bloggertricksandtoolz.com */

.showpageNum a:link,.showpage a:link {text-decoration:none;color:#fff;}/*www.bloggertricksandtoolz.com*/

</style>

<script type='text/javascript'>

var home_page="/";

var urlactivepage=location.href;

var postperpage=5;

var numshowpage=3;

var upPageWord ='Previous';

var downPageWord ='Next';

</script>

<script src='http://bloggertrickandtoolz.googlecode.com/files/www.bloggertricksandtoolz.com-bloggerpagenavi.js' type='text/javascript'></script>

just like that

Drop Your Comments And Questions Below.

Anda baru saja membaca artikel yang berkategori Blogger Tutorials dengan judul Add Pagination in Blogger. Anda bisa bookmark halaman ini dengan URL https://bblogger-tutorials.blogspot.com/2012/09/add-pagination-in-blogger.html. Terima kasih!

Ditulis oleh: maz - Wednesday, September 12, 2012