Πως να βάλετε εύκολα το Νumbered PageNavigation στο Blog σας .

Αυτό το script αντικαθιστά το στάνταρ blog pager που υπάρχει σε κάθε blog μας ( Νεότερες Αναρτήσεις , Αρχική Σελίδα , Παλαιότερες Αναρτήσεις ) , με αριθμημένες πλοήγησης σελίδας , που επιτρέπει στον αναγνώστη να πλοηγηθεί στα αρχεία με ευκολία και επιπλέον, προσφέρει τη δυνατότητα να προσαρμόσετε τον αριθμό των αναρτήσεων που θα εμφανίζονται σε κάθε σελίδα.
Παρακάτω σας δίνω scripts για δυο όμορφα  PageNavigations  .
Ας  δούμε λοιπόν  πως θα τα βάλουμε στο blog μας :

Στυλ 1 : SCROLL PAGE NAVI

1 .Κάνετε Login στο  Blogger λογαριασμό σας και πηγαίνετε Διάταξη –> Επεξεργασία HTML

2. Τώρα πατήστε στο  πληκτρολόγιο σας Ctrl+F  και ψάξτε στο πρότυπο σας την παρακάτω ετικέτα  :   ]]></b:skin>


3 . Kαι εισάγετε τον παρακάτω κώδικα ακριβώς από πάνω

<!--Page Navigation Starts-http://bloggertrics.blogspot.com/-->.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(http://i44.tinypic.com/14xp4dh.jpg) 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;}<!--Page Navigation Ends-http://bloggertrics.blogspot.com/-->

4 . Τώρα βρείτε στο πρότυπο σας ( στο τέλος του HTML κώδικα του πρότυπου ) την
ετικέτα </body>

5 . Και εισάγετε ακριβώς από πάνω τον παρακάτω κώδικα :

<script src='http://all-in-one-blogger-widget.googlecode.com/files/paginator3000.js' type='text/javascript'/><script type='text/javascript'>var home_page=&quot;/&quot;;var urlactivepage=location.href;var postperpage=5;var numshowpage=10;</script><script type='text/javascript'>//<![CDATA[eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\\u0077+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\\142','g'),k[c]);return p}('2\u0020r\0732 s\073\062 m;2\u0020f;\u0051\050)\073n\040R(\123){T=\125(\123/\u0067)+\u0031\073\u0032\u0020\u0049=h.\061g("\061\u0068-1i\042);J\u003d\'<\113 1\u006a="1k\u0022\u00201l\u003d\u0022\126\042\076\074/K><K\u003e<\141 u\u003d"\061m\072\057\u002f1n\0561\u006f\u002dW\056\061\u0070" \u0031q\u003d"1\162\u002d1\u0073: 1t\u003b\u0020\061\u0075\072\040\u0031v\u003b"\u0020\u0031w="1\170\042>1y\u00201z \061A-W\u003c\u002f\141\076\';6\u0028I)\173I\056\u0031\102\u003dJ\u007d1\103\u003d1D\u00201E\u0028\'V\',\124,\u0031F\054m\u002c"")\175n \114(v\u0029\u007b2 w\u003dv.w\0732\u0020X\u003dU\050w.1\u0047\u00241\u0048\u002e\u0024t,10)\u003b\122\050X\051}n Q\050){2 4=\071\u003b\u0036(4.\u0033("/i\057j\u002f\u0022)\041\u003d-1){\u0036(\u0034\u002e3("?x\u002d\u0035\042)!=\0551){f=\064.o\u00284\u002e\u0033("\057\u0069/j\057\u0022)\u002b14,\064.3("?\u0078\0555\u0022\u0029)\175k\u007bf\075\u0034.\157\0504\056\u0033\u0028"/\151/j\u002f")\u002b\u00314\u002c4\u002e\063\050\042?&5\u0022\u0029)}\1756(4\u002e\u0033("?q\075\042\u0029=\075-\u0031\046&4.\u0033\050".\112\u0022\051=\u003d-1)\u007b6(4.3\u0028\042/\u0069/j/\u0022\051\075=-\u0031){s=\u0022Y";6\0509.3\050"#p\u003d\u0022)\u0021=\0551)\u007bm=9.\u006f(9.3("#\160=")+8,\u0039.Z)}k\173\u006d=\061\u007d\u0068.\061\u0031\u0028"\0747 \u0079=\\""\u002bb+\u0022\172\057\101\u002f\102\0775-\u0063\u003d1&\u0043=D-\105\u002d7&\106=\u004c\\"><\\\u002f7>")}\153\173\u0073\u003d\042\u006a\042\0736(\u0034.\u0033("&\065-\u0063=\042)\u003d\u003d\u002d1){\u0067\0751I\u007d6(9\0563("\u0023p="\u0029\u0021=-1\u0029{m\0759\u002eo\u00289\u002e3("\u0023p\u003d\042)+8,\071.Z)}k{\u006d=1\175\150.\u0031\061(\'\u003c7 y="\'+b+\'z\u002fA/B/\055/\'+\u0066+\'?C=D\055E-\067\046\106=L&5-c\0751"\040\u003e\u003c\\\u002f7>\')}}\u007dn\0401J(\u0064){\u0036\u0028\u0064!\0751)\173G=(\u0064-1)*g\u003b\162=d;\062 H=h.1\u0032\u0028\'\u00313\')[0]\0732 e=h\u002e15(\'\u0037\');e.1\u0036\u003d\'\0617\u002f1\070\';\145.1a("y"\054\142+"z\057A/B\0771b\0551c=\042+G+\u0022\u00265\u002dc=1&C=D\055E\0557\u0026F\075M\u0022);\110.1d(e)}\u006b{l=b\073\u004e.u\u003d\154}}\156\0401K(\144)\u007b6(\u0064!\u003d1)\u007bG\075(d-\u0031\u0029*g\073r\u003dd;2 \110=h\u002e1\u0032(\'\u0031\u0033\')\u005b\060]\u003b2\040e=\u0068\u002e1\u0035(\'7\'\u0029;\145\056\u00316=\'\u00317\u002f1\u0038\';\145.\u0031\u0061(\u0022y\042\u002c\u0062\u002b"z/\101/B/\055\057"+\u0066+\u0022?1b\u002d1\143="\u002b\107\u002b\u0022\u00265-\u0063=1\u0026\u0043\u003d\u0044\055\u0045-\u0037&F\075\115\u0022\u0029\073\u0048\u002e1d\050\145\u0029\u007d\u006b{l\075b+\u0022i/j\057"+\146+"?&5\055c\075"\u002b\u0067\u003b\116.u=l}\u007dn\040M\050v\u0029{O=\166.w.1L\u005b0]\u003b2 1e=\117\0561f\u002e\u0024t.o\u00280\05419)+O.1f.\u0024\u0074.o(\u0031\115\u002c1N);2\u0020\u0050\075\u0031\117(1e)\u003b6(s\075=\042\131")\u007b\u0032\040\u006c=b\053\042i?x-5="+P+"\0465-c\075"\053g\053\u0022\u0023\160="\u002br}k{\062\u0020l=\u0062+"\151\057j\u002f\042+\u0066\u002b"\u003fx-5\u003d"\053\120+\042&\u0035-c\u003d"+g+\u0022\043\u0070=\u0022+r\u007dN\u002e\u0075=\154}',62,113,'||\u0076ar|i\u006e\144\145xO\u0066\u007ct\u0068i\u0073Url|\u006d\u0061\170|\u0069f\u007c\u0073cript||\165rla\143\164i\u0076e\160\u0061g\145||hom\u0065\u005fp\u0061g\145|\u0072e\u0073\u0075l\u0074s|\u006eu\155ber\160a\u0067\u0065\174\u006e\145\167I\156clu\u0064\u0065|\154\u0062l\156ame\u0031\174p\157st\160\u0065r\u0070ag\u0065\174\u0064o\u0063\u0075m\145nt|sea\u0072\143\150\174la\u0062\u0065\u006c\174\145\154se\u007calamat|\u006eome\u0072\u0068\u0061l\174\146u\u006e\u0063\164i\u006f\156|s\165bs\164\162\u0069ng|Pag\145\u004eo\u007c|no\160\141ge\u007c\152e\u006e\151\u0073||hr\u0065f\174\u0072\157\157t\u007c\u0066e\145\144\174updated|\163\u0072c\u007cf\u0065e\u0064\163|\u0070\u006f\u0073ts|s\165\u006dm\u0061\162\u0079|a\154t\174\152\u0073\u006fn|i\u006e\174call\142\u0061\143k|j\163\157n\u0073ta\162\164|nB\157\u0064y\u007c\u0062\u006c\u006fg\120\141\147er\u007chtml\174\u0064\151\u0076|\150itun\u0067to\164a\154\u0064\141t\u0061\u007c\146i\156d\u0064at\u0065p\u006f\u0073t|\u006cocat\151\157n|pos\u0074|tim\145\163tamp|\u0068\u0061l\141m\141\156blogg\145\u0072\174\u006c\u006fop\u0068\u0061laman|b\141\u006eyak\144ata|m\141ksimal\174\u0070a\u0072seI\u006et|pagin\141tor\061|\u0066arha\u006e|\u0074ot\u0061ld\u0061\u0074a|page\u007cleng\u0074h||w\u0072\151te\u007c\u0067\145t\105l\u0065m\u0065ntsByTa\147N\141me\u007che\u0061d|\u007c\u0063\162e\u0061teEl\145\155e\u006e\u0074|t\171\160e\u007ct\u0065\170t|j\141v\141\163c\u0072\u0069pt||\163\145\164At\u0074\u0072\151bute|st\u0061\162\u0074\174\151n\144ex\174a\u0070pe\u006e\u0064\u0043\u0068ild\174tim\145stamp\u0031\u007c\u0070\u0075\142lished|\u0067\u0065tE\u006c\u0065ment\u0042\u0079I\144|\142lo\u0067\u007cp\141ger\u007cclass\174p\141gi\156a\164\u006fr\u007c\u0069\144|h\164\164p|www|a\u0062u|c\157m|style|\u0066on\164|\163\u0069ze\u007c\067pt|\u0064is\u0070lay\u007cnone\174\u0074\141rge\164\174_b\u006c\u0061\u006ek\u007cWi\144get\u007cb\171\174Ab\u0075|\u0069\156n\u0065\u0072\u0048\u0054\u004dL\174pa\u00671\174\u006eew\u007c\u0050\141gin\141\164or|num\u0073h\157\u0077\160\u0061ge|openSe\u0061\162ch\174t\157\u0074a\u006c\122es\u0075lts|20\u007cre\144ir\145ct\160\u0061\147\145\u007credi\162ect\u006cab\145l|en\164ry\17423|\062\u0039|enc\u006f\u0064eU\122I\u0043o\u006d\u0070on\u0065n\164'.split('\174'),0,{}))//]]></script>

Τώρα αποθηκεύετε το πρότυπο σας και δείτε το αποτέλεσμα .

Σημείωση : Αν κάνετε Προεπισκόπηση Πρότυπου δεν θα είναι ορατό  το PageNavigation στην σελίδα σας

Στυλ 2 : Simple Web Page Navigation

1 . Κάνετε Login στο  Blogger λογαριασμό σας και πηγαίνετε Διάταξη –> Επεξεργασία HTML

2 . Τώρα πατήστε στο  πληκτρολόγιο σας Ctrl+F  και ψάξτε στο πρότυπο σας την παρακάτω ετικέτα  :   ]]></b:skin>

3. Και εισάγετε ακριβώς από πάνω τον παρακάτω κώδικα

<!--Page Navigation Starts-http://bloggertrics.blogspot.com/-->.showpageArea {font-family:verdana,arial,helvetica;color: #fff;font-size:11px; margin:10px;padding:8px 20px;background: #333;}.showpageArea a {color: #fff;}.showpageNum a {padding: 3px 8px;margin:0 4px;text-decoration: none;background: #666;}.showpageNum a:hover {background: #888;}.showpagePoint {color:#fff;padding: 3px 8px;margin: 2px;font-weight: 700;background: #AF0516;text-decoration: none;}.showpageOf{margin:0 8px 0 0;}<!--Page Navigation Ends-http://bloggertrics.blogspot.com/-->

4 .Τώρα βρείτε στο πρότυπο σας ( στο τέλος του HTML κώδικα του πρότυπου ) την ετικέτα </body>

5 . Και εισάγετε ακριβώς από πάνω τον παρακάτω κώδικα :

<!--Page Navigation Starts--><script type='text/javascript'>var pageCount=9;var displayPageNum=5;var upPageWord =&#39;Previous&#39;;var downPageWord =&#39;Next&#39;;</script><script src='http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js' type='text/javascript'/><!--Page Navigation Ends-->

Τώρα αποθηκεύετε το πρότυπο σας και δείτε το αποτέλεσμα .

Σημείωση : Αν κάνετε Προεπισκόπηση Πρότυπου δεν θα είναι ορατό  το PageNavigation στην σελίδα σας

Τους χρωματικούς συνδυασμούς  μπορείτε να αλλάξετε βεβαία ανάλογα με τις προτιμήσεις σας

Διαμόρφωση

var pageCount  -  Είναι ο αριθμός των συνδέσεων που θα εμφανιστούν μετά από τη σελίδα 1

var displayPageNum - Είναι ο αριθμός των αναρτήσεων που πρέπει να αναγράφονται σε κάθε link

var upPageWord - Είναι το link για τις προηγούμενες αναρτήσεις  (μπορείτε να αλλάξετε το κείμενο)

var downPageWord - Είναι το link για τις επόμενες αναρτήσεις  (μπορείτε να αλλάξετε το κείμενο)

Καλή  επιτυχία σε όλους !