Numbered Page Navigation For Blogger New Script
December 11th, 2009
Page navigation is need for all blogger because it can make navigation easy for your visitors. Previous script have some weakness :
- Maximum posts 500
- Have to read all JSON file if post so many make your blog slow
- Need long loop to calculate all posts (no body know this if they not read the script)
Now all those problems can be solved, Insya Allah. The script is different with My Previous Modification Nummbered Page Navigation for blogger, the script based on my own idea and for style I used from Mohamed Rias
To see the result open These demos:
- Demo for Minima
- Demo for Custom Template (Irressistible from Anshul)
- Demo for Classic from Choen Blog
Step 1 : Apply Style
- Login to Blogger Dashboard and navigate to Layout > Edit Html
- Don’t click the checkbox which says ‘Expand Widget Templates’
- Find this
]]></b:skin>
and replace it with
.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
border:1px solid #999;
-webkit-border-radius:3px;-moz-border-radius:3px;
background: #ddd;
}
.showpageOf {
margin:0 8px 0 0;
}
.showpageNum a:hover {
border:1px solid #888;
background: #ccc;
}
.showpagePoint {
color:#fff;
text-shadow:0 1px 2px #333;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
-webkit-border-radius:3px;-moz-border-radius:3px;
border:1px solid #999;
background: #666;
text-decoration: none;
}
]]></b:skin>
Above style use Old Style You can use Six other style from this Posts
Six Styles Page Navigation for Blogger
Step 2 : Aplly Javascript
Find This :
</body>
Replace with :
<script type='text/javascript'>
var home_page="/";
var urlactivepage=location.href;
var postperpage=7;
var numshowpage=4;
var upPageWord ='Prev';
var downPageWord ='Next';
</script>
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/pagenaviv202-min.js' type='text/javascript'></script>
</body>
Change based on your blog setting :
var postperpage=7;
var numshowpage=4;
Postperpage : How many Post every Page for your blog
numshowpage : how Many number will show in Your page Navigation
Step 3 : Customize Label (if you already use my previous Page Navi don’t use this step)
Go to the Edit HTML page and “Expand Widget Templates”
Find this (all of this text in your xml or template)
'data:label.url'
and Replace with this
'data:label.url + "?&max-results=7"'
Change 7 base on how many post every page
only That, I hope it can work and make your blog easy to navigate, amiin
- Six Styles Page Navigation for Blogger
- Beautiful New Page Navi For Blogger With Scroll
- Page navigation for Blogger with Google Style
- Page Navigation for Blogger (Problems Solved)
Categories: Featured, Page Navigation, Tips and Tricks Blogger
Related Articles :
230 Responses to “Numbered Page Navigation For Blogger New Script”
Leave a Reply

Categories
-
Recent Posts
My Twitter
- Check out the spots available on abu-farhan.com over at @buysellads http://bsa.ly/4kv about 9 months ago from Power Twitter
- Make Your Own Bookmarklets With jQuery http://bit.ly/aabeNC about 15 months ago from Snaptu
- Adobe Fireworks: Is It Worth Switching to CS5? http://bit.ly/bb1koh about 15 months ago from Snaptu
- HTML5 And Flash: Why It’s Not A War, And Why Flash Won’t Die http://bit.ly/ciy6u6 about 15 months ago from Snaptu
- Top 50 Web Graphics, Admin Skins and Scripts to Accelerate Development http://bit.ly/bHUole about 15 months ago from Snaptu
Archives
Blog Catalog





Hello Abul’m from Brazil and tested the browser with numbered pages in my blog is working properly. Congratulations on the site.
hugs
Thank you .Good work…
Thank you .Good work
Thank you very much. Thank you
Why is it not working? I have added it properly.. but when you already preview it, it doesn’t work?
cuz u r making mistake in 1st step bro.
i think u r applying other Styles (not the one as mention above), when you apply other stlyles, just simply add
”
]]>”
it will work InshAllah.
at the end of those customized styles.
thanks, pardon me for my bad English.
cuz u r making mistake in 1st step bro.
i think u r applying other Styles (not the one as mention above), when you apply other stlyles, just simply add
”
] ] > ”
(without space)it will work InshAllah.
at the end of those customized styles.
thanks, pardon me for my bad English.
thank you bro
Well, Abu, firstly Congrats on a creating a nice widget..
This widget is fine on home pages of blogger blogs, but when it comes to “Label pages”, the same old “Newer post, Home, Old Post” appears..
When one clicks on old posts your widget appears again..
This is rather weird and ungainly and could confuse blog visitors.
You can visit my site and click on “Trivia” link from horizontal menu.. It shows up 20 posts per page instead of 6 or 7(or ‘n’ posts for that matter)as mentioned in the widget variables..
Hope you will rectify it at the earliest. At least, plz give a reply on my comment..
Thanks
Hi there again,
Your page navigation widget is not working on “Label pages” and I’m frustrated as you could not reply..
I’m taking down your widget until you fix the bug..
I understand that you could be totally busy, but you know, there is nothing worse than being ignored..
We sure, are using your widget but we are also giving back a free one-way backlink.
Think over…
Also, what’s the point, if you can’t offer support.
Regards
Assalamualaikum
Alhamdulillah
Akhirnya bisa juga, terima kasih kang abu, mohon izinya untuk mengedit scriptnya, haturnuhun.
Sweet post.
i am helpless to change widget and moving of widgets on my blog, as i have added new template arthemia new..
please help me out
actually allignment of text is not right, also i am not able to remove some widgets which i dont need.
Assalamu’alaykum…
Ahlan Wa Sahlan!
Syukron Katsiron Mas Abu Farhan..
Ilmunya berhasil saya terapkan di blog saya..
Mas Abu..
Apa bisa saya Mohon izin hilangkan linknya?