Amazing Paginator3000 Widget For Blogger

Important: All scripts hosted on widcraft.googlecode.com don't work anymore because Google has blocked that SVN repository.

This amazing widget is created by the amazing Abu Farhan and you can check his blog by clicking here. This page navigator supports more than 500 pages even more and this is the most beautiful page navigation widget ever for blogger. Thanks to Abu Farhan for creating this widget. Here we go:

• Go To Blogger > Template > Edit Html > Search for ]]></b:skin> and just above it post following css:

.paginator {
margin-top:60px;
font-size:1em;
}
.paginator table {
border-collapse:collapse;
table-layout:fixed;
width:100%;
}
.paginator table td {
padding:0;
white-space:nowrap;
text-align:center;
}
.paginator span {
display:block;
padding:3px 0;
color:#fff;
}
.paginator span strong,
.paginator span a {
padding:2px 6px;
}
.paginator span strong {
background:#ff6c24;
font-style:normal;
font-weight:normal;
}
.paginator .scroll_bar {
width:100%; height:20px;
position:relative;
margin-top:10px;
}
.paginator .scroll_trough {
width:100%; height:3px;
background:#ccc;
overflow:hidden;
}
.paginator .scroll_thumb {
position:absolute;
z-index:2;
width:0; height:3px;
top:0; left:0;
font-size:1px;
background:#363636;
}
.paginator .scroll_knob {
position:absolute;
top:-5px; left:50%;
margin-left:-10px;
width:20px; height:20px;
overflow:hidden;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhps5RxgtF3-w3BppXgcFrg1cNeMUmukR0eRWUoObUKJwqPFr7g0VHgzLLDRnTcfU98W63kEL3-3b8GOllFe4oxWsacQkyInZI11wDH8_7NrJyzplYxA7RKhxjLjRLLwiMgL9WbXsi2xGA/s1600/slider_knob.gif) no-repeat 50% 50%;
cursor:pointer; cursor:hand;
}
.paginator .current_page_mark {
position:absolute;
z-index:1;
top:0; left:0;
width:0; height:3px;
overflow:hidden;
background:#ff6c24;
}
.fullsize .scroll_thumb {
display:none;
}
.paginator_pages {
width:600px;
text-align:right;
font-size:0.8em;
color:#808080;
margin-top:-10px;
}

• Now find </body> and just above </body> post following script:

<script src='http://widcraft.googlecode.com/svn/Paginator3000.js' type='text/javascript'></script>
<script type='text/javascript'>
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=7;
var numshowpage=6;
</script>
<script src='http://widcraft.googlecode.com/svn/Paginator3000ForBlogger.js' type='text/javascript'/>

Change based on your blog setting :
var postperpage=7;
var numshowpage=6;

Postperpage : How many Post every Page for your blog
numshowpage : how Many number will show in Your page Navigation

• Now click on "Expand Widget Templates" and find 'data:label.url' and replace it with following code:

'data:label.url + &quot;?&amp;max-results=7&quot;'

Change 7 base on how many post every page..........

Important: Check our new website TricksPanda.com for WordPress tutorials, plugins and more.