Blogger Sayfa Numaralandırma Eklentisi

Blogger Sayfa Numaralandırma Eklentisi

Blogger kullanıcıların en büyük sorunlarından biride kullandıkları temalarda Blogger Numaralandırma Eklentisi gelmekte. Blogger Numaralı Sayfa Navigasyon her ne kadar standart blogger temalarında görülürken çağın ihtiyaçlarına cevap vermek isteyen tasarımcılar kodladıkları günümüzdeki bazı temalarda da bu sorun bulunmakta.


Ziyaretçilerinizin blogunuzdaki kayıt sayfaları arasında daha rahat dolaşmalarını sağlamak istiyorsanız numaralı sayfa navigasyonu eklemeniz faydalı olacaktır.

numaralı sayfa navigasyonu eklemek için blogunuzun şablonundan aşağıdaki kodu bulun
  <b:widget id='Blog1' locked='true' title='Blog Kayıtları' type='Blog'>  

Yukardaki Kodu Bulduktan sonra hemen alt satırına aşağıdaki kodları ekliyoruz
 <b:includable id='page-navi'>  
 <div class="pagenavi">  
 <script type="text/javascript">  
 var pageNaviConf = {  
 perPage: 5,  
 numPages: 5,  
 firstText: "İlk",  
 lastText: "Son",  
 nextText: &quot;&#187;&quot;,  
 prevText: &quot;&#171;&quot; }  
 </script>  
 <script type="text/javascript" src="https://wepbloggercom.googlecode.com/svn/pagenavi.js"></script>  
 <div class="clear" />  
 </div>  
 </b:includable>  

Yukardaki Koduları ekledikten hemen sonra şablonda aşağıdaki kodu buluyoruz
 <!-- navigation -->  
 <b:include name='nextprev'/>  
  Yukardaki kodu bulduktan sonra bulduğunuz kodu aşağıdaki kodu ile değiştiriyoruz
 <b:if cond='data:blog.pageType == "index"'>  
 <b:include name='page-navi' />  
 <b:else/>  
 <b:if cond='data:blog.pageType == "archive"'>  
 <b:include name='page-navi' />  
 </b:if>  
 </b:if>  

 
Bu işlemlerden sonra şimdi de temanızda aşağıda bulanan numaralı sayfa navigasyonularından birini ]]></b:skin> kodunun üzerine ekleyerek şablonu kaydettiniz..

 .pagenavi{clear:both;margin:10px auto;text-align:center} .pagenavi span,.pagenavi a { font-size:12px;padding: 2px 4px 2px 4px;margin: 2px;border: 1px solid #dfdfdf;color:#000;} .pagenavi a:visited{} .pagenavi a:hover,.pagenavi .current{color: #FFF;background-color: #e81d1d;border: 1px solid #fb1515;text-decoration:none;}   


 .pagenavi{clear:both;margin:10px auto;text-align:left}  
 .pagenavi span,.pagenavi a {background:#0e0f10;font-size:12px;padding: 3px 5px;margin: 2px;border: 1px solid #333;color:#fff;}  
 .pagenavi a:visited{}  
 .pagenavi a:hover,.pagenavi .current{color: #FFF;background-color: #33393f;border: 1px solid #444;text-decoration:none;}  

 .pagenavi{clear:both;margin:30px auto 20px;text-align:center}  
 .pagenavi span,.pagenavi a{background:#24bde2;border:1px solid #4adcff;padding:3px 8px;color:#fff;margin:2px;font-size:12px}  
 .pagenavi span{color:#3a3a3a}  
 .pagenavi a:hover,.pagenavi .current{color:#fff;background:#ff6734;border:1px solid #ddd;text-decoration:none}  
 .pagenavi .pages{display:none}  

 .pagenavi{background:#3498b9;clear:both;margin:30px auto 20px;text-align:center;border:1px solid #2f7a93;padding:4px 0}  
 .pagenavi span,.pagenavi a{font-weight:bold;padding:7px 8px;color:#fff;margin:1px;font-size:11px}  
 .pagenavi span{color:#3a3a3a}  
 .pagenavi a:hover,.pagenavi .current{background:#236e8f;color:#fff;text-decoration:none}  
 .pagenavi .pages{color:#fff}  

 .pagenavi{background:#f1f1f1;clear:both;margin:30px auto 20px;text-align:center;border:1px solid #bfbfbf;padding:3px 0} .pagenavi span,.pagenavi a{border:1px solid #f1f1f1;padding:1px 4px;color:#000;margin:2px;font-size:12px} .pagenavi span{color:#3a3a3a} .pagenavi a:hover,.pagenavi .current{border:1px solid #bfbfbf;background:#fffdf0;color:#000;text-decoration:none} .pagenavi .pages{color:#666}   

Daha Fazlası: RSS Feed | Email Aboneliği Yayın Sayısı :