Cum numerotezi paginile pe Blogger

Pe site-urile si blog-urile realizate pe platforma blogger toate temele oferite nu au paginile numerotate. Putem seta doar cate postari sa apara pe o pagina in functie de categoria selectata sau pe prima pagina, iar apoi pentru a trece la urmatoarea pagina trebuie sa optam pentru "Postari mai vechi" si "Postari mai noi".  

In primul rand pentru a seta un anumit numar de postari pe pagina de pornire sau pe paginile cu categoriile de produse trebuie sa faci urmatoarele: 
Mergi la Setari  > Postari si comentarii > Doresc sa se afiseze cel mult > 10  postari/zele in prima pagina.
Dupa ce iti setezi numarul de postari pe care vrei sa il afisezi in pagina pentru ca blogul tau sa arate ca un site profesional elimina "Postare mai noua", "Postare mai veche" si "Pagina de pornire".

Pentru a numerota paginile pe Blogger vei avea de realizat doi pasi:
1. Adauga CSS-ul designului dorit;
2. Adauga Script-ul;

Pasul 1: Adaugarea CSS-ului;

1. Mergi la Sablon  > Editati HTML;
2. In interiorul sablonului apasa CTRL+F si cauta: ]]></b:skin>. Inainte de acest cod adauga codul design-ului dorit pentru numerotarea paginilor.


Stil 1

 
#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 3px 7px;margin-right:5px;background:#E9E9E9;color: #888;border:1px solid #E9E9E9;}
.displaypageNum a:hover,.showpage a:hover,.pagecurrent{background:#CECECE;text-decoration:none;color: #000;}
 .showpageOf{display:none!important}
#blog-pager .showpage, #blog-pager .pagecurrent{font-weight:bold;color: #888;}
 #blog-pager .pages{border:none;}

Stil 2

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 5px 10px;margin-right:5px; color: #F4F4F4; background-color:#404042;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#EC8D04;text-decoration:none;color: #fff;}
#blog-pager .showpage, #blog-pager, .pagecurrent{font-weight:bold;color: #000;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}

Stil 3

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px; }
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{font-size: 13px;padding: 5px 12px;margin-right:5px; color: #AD0B00; background-color:#FAB001;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#DB4920;text-decoration:none;color: #fff;}
#blog-pager .pagecurrent{font-weight:bold;color: #fff;background:#DB4920;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;}

Pasul 2: Adaugarea script-ului;
Cauta urmatorul cod (CTRL+F): </body>
Acum adauga inainte de acest cod urmatorul script:

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
  /*<![CDATA[*/
    var perPage=7;
    var numPages=6;
    var firstText ='First';
    var lastText ='Last';
    var prevText ='« Previous';
    var nextText ='Next »';
    var urlactivepage=location.href;
    var home_page="/";
  /*]]>*/
</script>
  <script src="http://helplogger.googlecode.com/svn/trunk/page-navigation2.js"/>
</b:if>
</b:if>

Configurare:
1. perPage: cate postari vor fi afisate pe fiecare pagina (7);
2. numPage: cate pagini vor fi afisate;
3. Inlocuieste First, Prevision, Next cu orice alt text doresti;