Blogger için Sayfa Numaralandırma (Page Nav) eklentisi

Murat Yaman | 13:25 | | |

Blogger için sayfa numaralandırma eklentisi

Blogger'da eski sayfalara ulaşmak ya da sayfalar arasında dolaşmak istediğimizde, ana sayfanın hemen altında Önceki Kayıt ve Sonraki Kayıt şeklinde bağlantılar görürüz. Bu bağlantılar yerine, yukarıdaki resimde görebileceğiniz gibi; toplam yayın sayısının, ana sayfada gösterilmesini istediğimiz yayın sayısına bölümü ile elde edilen, toplam sayfa sayısının gösterilmesi ve sayfaların da numaralarla erişilebilir olması için yapmamız gereken Sayfa Numaralandırma - Page Nav eklentisini blogumuza eklemektir.

Kurulum

  • Blogger Kumanda Paneli > Yerleşim > Gadget Ekle > HTML/JavaScript komutlarını uygulayarak yeni bir gadget oluşturuyoruz.
  • Gadget'e Page-Nav ismini vererek, aşağıda yer alan kodları içerik kısmına ekliyor ve kaydediyoruz. 
    <!-- sayfa numaralandirma code START -->
<style type='text/css'>
.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
border:1px solid #aeaeae;
margin:0 3px;
padding:3px 7px;
text-decoration:none;
color:#333333;
}
.showpageNum a:hover {
background-color:#F0E0C5;
border:1px solid #000000;
color:#333333;
}
.showpagePoint {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:#FF7637 none repeat scroll 0 0;
border:1px solid #FF7637;
color:#fff;
margin:0 3px;
padding:3px 7px;
text-decoration:none;
}
.showpageOf {
margin:0 3px 0 0;
padding:3px 7px;
text-decoration:none;
color:#333333;
}
.showpage a {
border:1px solid #aeaeae;
padding:3px 7px;
text-decoration:none;
color:#333333;
}
.showpage a:hover {
text-decoration:none;
color:#333333;
}
.showpageNum a:link, .showpage a:link {
color:#333333;
text-decoration:none;
}
</style>


<script type='text/javascript'>

var home_page_url = location.href;

var pageCount=10;
var displayPageNum=3;
var upPageWord ='�nceki';
var downPageWord ='Sonraki';

function showpageCount(json) {
var thisUrl = home_page_url;
var htmlMap = new Array();
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

for(var i=0, post; post = json.feed.entry[i]; i++) {

var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);

var title = post.title.$t;

if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
  thisNum = postNum;
}

if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'&max-results='+pageCount;
}
}
itemCount++;

}

for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
 upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}else{
 upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}

fFlag++;
}

if(p==(thisNum-1)){
html += '<span class="showpagePoint">'+thisNum+'</span>';
}else{
if(p==0){
  html += '<span class="showpageNum"><a href="/">1</a></span>';

}else{
 html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
}
}

if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}
}

if(thisNum>1){
html = ''+upPageHtml+' '+html +' ';
}

html = '<div class="showpageArea"><span  class="showpageOf"> Toplam Sayfa ('+(postNum-1)+')</span>'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;
}

if(postNum==1) postNum++;
html += '</div>';

var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");

if(postNum <= 2){
html ='';
}

for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}

if(pageArea&&pageArea.length>0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}

}

function showpageCount2(json) {

var thisUrl = home_page_url;
var htmlMap = new Array();
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';
var thisUrl = home_page_url;

for(var i=0, post; post = json.feed.entry[i]; i++) {

var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);

var title = post.title.$t;

if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
 thisNum = postNum;
}

if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'&max-results='+pageCount;

}
}
itemCount++;
}

for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
 upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
 upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}

fFlag++;
}

if(p==(thisNum-1)){
html += '<span class="showpagePoint">'+thisNum+'</span>';
}else{
if(p==0){
 html = labelHtml+'1</a></span>';
}else{
 html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
}
}

if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}
}

if(thisNum>1){
if(!isLablePage){
html = ''+upPageHtml+' '+html +' ';
}else{
html = ''+upPageHtml+' '+html +' ';
}
}

html = '<div class="showpageArea"><span  class="showpageOf"> Toplam Sayfa ('+(postNum-1)+')</span>'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;
}

if(postNum==1) postNum++;
html += '</div>';

var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");

if(postNum <= 2){
html ='';
}

for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}

if(pageArea&&pageArea.length>0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}

}

</script>
<script type='text/javascript'>

var thisUrl = home_page_url;
if (thisUrl.indexOf("/search/label/")!=-1){
if (thisUrl.indexOf("?updated-max")!=-1){
var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max"));
}else{
var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max"));
}
}

var home_page = "/";
if (thisUrl.indexOf("?q=")==-1){
if (thisUrl.indexOf("/search/label/")==-1){
document.write('<script src="'+home_page+'feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" ><\/script>')
}else{document.write('<script src="'+home_page+'feeds/posts/full/-/'+lblname1+'?alt=json-in-script&callback=showpageCount2&max-results=99999" ><\/script>')
}
}
</script>
<!-- sayfa numaralandirma code END -->
  • Numaralandırma işleminin, yalnızca ana sayfada etkin olması için tema kodları içindeki küçük bir değişiklik yapmamız gerekiyor. Bunun için; Şablon > HTML’yi Düzenle > Devam Et > Widget Şablonlarını Genişlet komutlarını uyguluyoruz.
  • CTRL+F tuş kombinasyonu yardımıyla Page-Nav kelimesini aratıp buluyoruz.
  • Bulduğumuz satırın altında aşağıdakine benzer kodlar göreceksiniz. Bu kodları siliyoruz. 
    <b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
  • Sildiğimiz kodların yerine ise aşağıda yer alan kodları ekliyoruz. 
    <b:includable id='main'>
  <div class='widget-content'>
    <b:if cond='data:blog.pageType == &quot;index&quot;'><data:content/></b:if>
  </div>

  <b:include name='quickedit'/>
</b:includable>

Ayarlar

var pageCount=10; Ana sayfada yer almasını istediğimiz yayın sayısı değeri ile aynı olmalı. Yoksa sayfa sayısı yanlış hesaplanır.

var displayPageNum=3; İçinde bulunduğumuz sayfadan önce ve sonra yer almasını istediğimiz sayfa sayısı değeri.

Gadget içine eklediğimiz kodlarda yer alan CSS etiketlerinin içeriğini değiştirerek, eklentiyi kendi temanıza uygun hale getirebilirsiniz.

Son olarak; eklenti ile ilgili sorun yaşayacak olursanız, probleminizi yorum bölümüne yazarak bana iletebilirsiniz.


Murat Yaman

Yazar hakkında :

Merhaba, 'da; güncel konular, okuduğum kitaplar, seyrettiğim filmler ve teknolojik gelişmeler hakkında öznel değerlendirmelerimi paylaşmaya çalışıyorum. Kendimi; Profesyonel Okur, Amatör Yazar olarak tanımlıyorum. Google Plus profilim ve paylaşımlarım için + bağlantısını ziyaret edebilirsiniz.
Murat Yaman | www.murat-yaman.com | Blog Editörü

Hiç yorum yok:

Yorum Gönder

Lütfen yorum yazarken aşağıdaki noktaları göz önünde bulundurun.

1- Yaptığınız yorumun, yazıyla alakalı olmasına özen gösteriniz.
2- Yazım ve dilbilgisi konusunda özen gösteriniz ve argo kelimelerden uzak durunuz.
3- Reklam amaçlı yorumlarda bulunmayınız.

Kaydol: Kayıt Yorumları (Atom)