Steps to Add Numbered Page Navigation for blogger :
Step 1 :Goto Blogger Dashboard-> Design -> select Edit HTML , check Expand widget templates and search the code:
Replace 3165915938957690449 into your BlogID and 5 of the posts you want to display on a page.
Thats it :)
Step 1 :Goto Blogger Dashboard-> Design -> select Edit HTML , check Expand widget templates and search the code:
<b:include name='nextprev'/>Step 2 : Replace it with the following code:
<b:if cond='data:blog.pageType "index"'> ==
<style type="text/css">
. Blogpager {
font-size: 16px;
color: # 060;
font-weight: bold;
padding: 0px 4px;
}
</style>
<div align="center" style="margin:5px;"> <form action="#" name="pager20"> <span id="vwg-pager-first"> </ span> <span id = " vwg-pager-prev "> </ span> <input name =" showingpage "onfocus =" this.select () "value =" init ... " type = "text" size = "4" title = "Enter page number That You want to go" /> / <input size = "4" type = "text" name = "pagestotal" disabled = "disabled" value = " init ... " /> <input Type="button" /> <span onclick="checkpager()" value="Go" id="vwg-pager-next"> </span> <span id = "vwg-pager-last" > </span>
</form> </div>
<script type="text/javascript">
blogID var = "3165915938957690449";
home_page var = "/";
var pager_max_main = 5 ;
pager_first_text var = "First";
pager_last_text var = "Last";
pager_prev_text var = "Prev";
pager_next_text var = "Next";
</script>
<script type='text/javascript'>
/ / <! [CDATA [
pager_max_results var = 20;
if (location.href.match ("max-results =")) {
pager_max_results = parseInt (location.href.substring (location.href.indexOf ("max-results =") +12). split ("\ &") [0]);
} Else if (! Location.href.match ("/ search / label /")) {
pager_max_results = pager_max_main;
}
var per_page = pager_max_results;
if (! location.href.match ('/ search / label /')) {
pager_feedx = "http://www.blogger.com/feeds/" + blogID + "/ posts / summary";
pager_pageurl = home_page + "search";
}
else {
location.href.split label = ("/") [5];
label = label.split ("?") [0];
label = label.replace (/ / g, "% 20");
pager_feedx = "http://www.blogger.com/feeds/" + blogID + "/ posts/summary/- /" + label;
pager_pageurl = home_page + "search / label /" + label;
}
pager_opening var = 1;
if (location.href.match ("popening =")) {
pager_opening = parseInt (location.href.substring (location.href.indexOf ("popening =") +9). split ("\ &") [0]);
}
NUM_PAGES var = 1;
createBlogPager function () {
var script = document.createElement ('script');
script.src = pager_feedx + "? start-index = 1 & max-results = 0 & alt = json-in-script & callback = countnumpost";
script.type = "text / javascript";
document.getElementsByTagName ('head') [0]. appendChild (script)
}
countnumpost function (json) {
var posts = json.feed.openSearch $ totalResults. $ t;
NUM_PAGES = (posts% per_page == 0)? posts / per_page: Math.floor (posts / per_page) +1;
var a1 = document.createElement ("a");
a1.className = "blogpager";
a1.title = "Jump to page: (1)";
a1.href = "javascript: page (1)";
a1.innerHTML = pager_first_text;
document.getElementById ("vwg-pager-first"). appendChild (a1);
var a4 = document.createElement ("a");
a4.className = "blogpager";
a4.title = "Jump to page: (" + NUM_PAGES + ")";
a4.href = "javascript: page (" + NUM_PAGES + ")";
a4.innerHTML = pager_last_text;
document.getElementById ("vwg-pager-last"). appendChild (a4);
var prev = (pager_opening! = 1)? pager_opening-1: 1;
var a2 = document.createElement ("a");
a2.className = "blogpager";
a2.title = "Jump to page: (" + prev + ")";
a2.href = "javascript: page (" + prev + ")";
a2.innerHTML = pager_prev_text;
document.getElementById ("vwg-pager-prev"). appendChild (a2);
var next = (pager_opening! = NUM_PAGES)? pager_opening +1: NUM_PAGES;
var a3 = document.createElement ("a");
a3.className = "blogpager";
a3.title = "Jump to page: (" + next + ")";
a3.href = "javascript: page (" + next + ")";
a3.innerHTML = pager_next_text;
document.getElementById ("vwg-pager-next '). appendChild (a3);
document.pager20.showingpage.value = pager_opening;
document.pager20.pagestotal.value = NUM_PAGES;
}
checkpager function () {
uinput var = parseInt (document.pager20.showingpage.value);
if ((uinput <= NUM_PAGES) && (uinput> = 1)) {
page (uinput);
}
else {
alert ("Invalid page number. Please try by another!");
document.pager20.showingpage.focus ();
document.pager20.showingpage.select ();
}
}
getDateAndGo function (json) {
json.feed.entry var date2 = [0]. published. $ t;
ss = parseFloat (date2.substring (17.19));
if (ss <59) ss + +;
if (ss <10) {ss = "0" + ss;}
date4 = encodeURIComponent (date2.substring (0.17) + ss + date2.substring (23, date2.length));
pager_pageurl + location.href = '? updated-max =' + date4 + '& max-results =' + per_page + '& popening =' + pager_opening;
}
function page (startIndex) {
pager_opening = startIndex;
per_page * var i = (startIndex-1) +1;
script2 var = document.createElement ("script");
script2.src = pager_feedx + "? start-index =" + i + "& max-results = 1 & alt = json-in-script & callback = getDateAndGo";
document.getElementsByTagName ('head') [0]. appendChild (script2)
}
createBlogPager ();
/ /]]>
</script>
</b:if>
Replace 3165915938957690449 into your BlogID and 5 of the posts you want to display on a page.
Thats it :)
0 comments:
Post a Comment
1.Your feedback is appreciated .we will try to respond as soon as possible .
2.While commenting make sure you click "subscribe by mail ", so that you will be notified follow up replies
3.Please don't spam ,dont use keyword in the name section, don't drop the links for the sake of backlinks and other purpose ( Comments will not be published and deleted)
4.Make sure you check the previous comments , before asking any any queries . you may get the solition in the comments itself.
5.Comments should be related to the topic .
if above all not followed the user may result in ban :(