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
384 Responses to “Numbered Page Navigation For Blogger New Script”
Leave a Reply
Hey if i want to don’t show some post in the navigation then what to do????
I have added a basic search box widget with the following code:
the numbered page navigation did not show but the newer post, older post show up. How do I incorporate this number page navigation so that it will show up at search result page?
Thank you , it realy works.
“Replace with :” itu artinya “ganti dengan”
masa diganti??
saya masih blm ngerti nih..
tolong d bantu
alhamdulillah it’s work, thanks
Simply Awesome…
Our friend Mohammad Mustafa Ahmedzai suggested me to have a look at your site for Page Navi widget and I tried it on my demo blog and it is working awesome…
Thank You Very Much…:)
Samsexy98
hello sir please help me i’m really pissed off i dun knw wht the prblem is
when i kept the posts in this way in http://www.hentairon.blogspot.com its workin but when i kept posts in another way in http://teztingz.blogspot.com/ its nt workin see some sort of overflow next to third box please help ASAP
Great Job
Thanks
kang abu,.. ato tmn yg laen… minta pencerahannya???
gmn nampilkan page nav number di semua singel post..???
karna punya saya cuma tampil di tiap posting tok
tolong donk?!!!
coba deh liat preview-ny di weblog saya
Assalamualaikum Abu farhan!
May i remove the link Widget by Abu-farhan？ You Know i have a little problem with my pagerank
please please please email me。
alhamdullialah dengan ini saya bisa tahu dan sangat membantu sekali
Syukron jazila.. ana astathi’ fisti’mali hadzihi at-thriqoh.. bihusni tadribik.. ;)
visit my blog plz.. >> artiqels.co.cc
I donnot like the advertisement under the navigator line !!!
please remove that ads and your widget will look better
I had try it successful in my main page but when i went to my label page, it return to the origin ones! Can u help me to add the page navigation with style 3 in my blogger templates? If can, i will send u my templates later. THX!
Assalamualaikum…
thx 4 your tips
it works in my blog
TQ
Não funcionou! NOT FUNCTION SCRIPT IN MY BLOG
Assalamualaikum…
thanks for your page navigation widget…
these are applicable to
http://bmcku.blogspot.com/
http://perpustakaansyairdanpuisi.blogspot.com/
[...] 2. The second code is the most stylish and coolest Navigation provided by Abu Farhan on his own name site. You can also get the codes for your site over “Page Navigation By Abu Farhan“ [...]
mercii :))
Assalamualaikum Abu farhan!
May i remove the link Widget by Abu-farhan.. You Know i have a little problem with my pagerank
please please please email me
PS: I’m willing to pay you for this widget, soon after i get my payment from google ads!
Thank you very much Farhan
wassalamualaikum!
merci mon amie c’est très intéressant …
dear brother,
assalamu alaikku. its not working in my blog. advice pl.
…
ZXU You guys have a fantastic blog site heading below, KIU! -PX….
Artikel yang sangat menarik, Makasih infonya, langsung tak coba..
Reading this blog it is amazing what garbage time wasters will add to a post, Really what is the point? Give the blogger a break and stop adding so much spam.
salam abu farhan i try this method and it work nice on my blog , i have fixed number page in labels but another problem !!!!!!!!
how I can fix number of page in blog archive ? because when I click on blog archive it give me lot of post in the same page and I would like to fixe it ( 5 post in page on blog archive )
Hello i hv a problem
first for all thanks for wonderful script.
your script is working on the main page but when someone tries to open the lebel (category) page navigation fails .it shows old style in a specific category
please resolve this issue
maafkn saya??
kok,code ini bagus,
tp sy maw page template mcm kamu??
bley gak??
salam abu farhan..sudah 5x saya cuba buat..follow step tue 1-1..adakah template blog saya tak sesuai atau memang saya yang silap step??huhu..
2eFb1H xlembufhbynz, [url=http://vnbnkmkujzbe.com/]vnbnkmkujzbe[/url], [link=http://adseonjxoeel.com/]adseonjxoeel[/link], http://fwuuipbkxwry.com/
Great, it workes on my blog. Thank you so much Mr Abu.
does it work with the new blogger templates too?
Your page navigation is not working for me please help me out, i tried alot of css on it, but nothing is working on it, your widget is stubborn
I need help, the css for this widget is not working for me, please check that why is this problem occuring,
its on http://www.bloghuts.com
thank you
cool post ~ i like this hack so much~
works fine for me… that great … wawwwwwwwwwwo
Assalamu alaikum.. salam kenal mas abu makasih sharenya yg brmamfaat..
Assalamu Alaikum.. salam knl mas Abu Farhan.. trimah kasih sharenya yg tlah brhasil aq trapkan.. smoga sukses slalu
Assalamu Alaikum.. salam kenal mas Abu Farhan.. makasih sharenya tlah brharil aq terapkan.. smoga suses selalu..
Assalamu Alaikum.. salam kenal mas Abu Farhan.. terimah kasih sharenya yg telah berhasil aq terapkan.. Semoga sukses selalu dan ilmunya selalu brtambah buat kita belajar khusnya aq yg masih newbie
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?