21 Ocak 2017: Cumartesi

Blogger Sayfa Numaralandırma Eklentisi

Bu yazı 3 sene [3 seneden daha eski de olabilir] veya daha önce yayınlanmış olduğundan; görülen linklerde, resimlerde veya kodlarda hata olması çok olası. Herhangi bir hata ile karşılaşmanız durumunda bana buradan bildirebilirsiniz. Anlayışınız için teşekkür eder, keyifli okumalar dileriz :) Enes İLHAN
Blogger İpuçları 15 Aralık 2009 28 19.597  
Bu Kişisel Blog'da 544 kategori'de yazıya yazılmış adet değerli yorumlarınız bulunmaktadır..

Yine Blogger İpuçları Serisi ile devam ediyoruz arkadaşlar. Bugün, anlatımı birçok sitede mevcut olduğu halde herkesin yapamadığı bu eklentiyi yapıcaz inşallah.Benim blogumda da kullandığım üzere bu eklenti WordPress bloglardan görülerek Blogger’a uyarlanmıştır. Yapacağımız bu sayfalandırma eklentisi bence herkesin blogunda olmasını istediği ve gerçekten olması gereken bir eklenti. Şimdi “Ben o kadar sitede gördüm yapamadım.Buda kesinlikle olmaz” diyen arkadaşlar olabilir. Haklılarda aslında.Ama ben bu eklentiyi tam tamına 4 farklı tema yükleyerek deneme blogunda hepsinde çalıştırdım. Şuda denediğim bloglardan 4 tanesi:

tema

Daha fazla deneyip size göstermek isterdim de insan bir yerden sonra bıkıyor. Hep aynı işlemler yani 4 tane de az değil bence.Bu eklenti o kadar kolayki size sadece iki kod vereceğim. Vereceğim bu iki kod ile inşallah sizlerde blog sayfalarınızda bu eklentiyi çalıştıracaksınız.Hazırsak hemen anlatıma geçelim:

Çok Önemli Not: Önceki yazımda da belirttiğim gibi blogumda smiley eklentisi kullandığımdan dolayı kodlar smiley olarak gözüküyor.Bunun için sayfa tam yüklenmeden tarayıcınızdaki “Durdur” ikonuna tıklayarak kodları çok kolay bir şekilde kopyalayabilirsiniz…

Her zaman ki gibi Blogger hesabımıza girip “Yerleşim/HTML’yi Düzenle” sekmesine gelip “Widget Şablonlarını Genişlet” tikini aktif hale getirdikten sonra </b:skin> kodundan önce şu kodları yapıştıralım:

.showpageNum a {
font-size:12px;font-weight:bold;
padding:5px 7px 5px 7px;
color:#006699;
border:1px solid #CCC;
-moz-border-radius:3px;-
webkit-border-radius:3px;
}
.showpageNum a:hover {
text-decoration:none;
padding:5px 7px 5px 7px;
color:#3C78A7;
border:1px solid #1584d9;
background:#f0f4f7;
-moz-border-radius:3px;
-webkit-border-radius:3px;
}
.showpagePoint {
background:#84bb01;
font-size:12px;font-weight:bold;
padding:5px 7px 5px 7px;
color:#fff;
border:1px solid #CCC;
-moz-border-radius:3px;-
webkit-border-radius:3px;
}
.showpageOf {
clear:both;
padding:15px;
text-align:center;
font-size:12px;
font-weight:bold;
color:#999;
margin:10px auto 10px auto;
}
.showpage a {
font-size:12px;font-weight:bold;
padding:5px 7px 5px 7px;
color:#006699;
border:1px solid #CCC;
-moz-border-radius:3px;-
webkit-border-radius:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
font-size:12px;font-weight:bold;
padding:5px 7px 5px 7px;
color:#006699;
border:1px solid #CCC;
-moz-border-radius:3px;-
webkit-border-radius:3px;
}

Burası işin en basit tarafıydı şimdi size bulmanız gereken ikinci kodu vericem.Ama burayı detaylı anlatmazsam yine yapamayanlardan olabilirsiniz ! O yüzden burayı daha dikkatli okumanızda fayda var.Şimdi yukarıdaki kodları yapıştırdıktan sonra CTRL+A tuşuna basıp </b:section> kodunu bulunca klavyenizden “Enter” tuşuna basıktan sonra şöyle bir kod bulmuş olacaksınız: (Resimle göstereyim)

Evet yukarıdaki resimde de görüleceği gibi siz “Enter” tuşuna basarak 2.section yani bölüme gelmiş olacaksınız. Yalnız resimde de görüldüğü gibi section kodunun altında div kodu olmasına dikkat edin. İşte </b:section> ile div kodunun arasını yine Enter tuşuna basarak açın ve o ara boşluk bölüme şu kodları yapıştırın:

<script type="text/javascript">

function showpageCount(json) {
var thisUrl = location.href;
var htmlMap = new Array();
var isFirstPage = thisUrl.substring(thisUrl.length-5,thisUrl.length)==".com/";
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var isPage = thisUrl.indexOf("/search?updated")!=-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 pageCount = 5;
var displayPageNum = 5;
var upPageWord = 'Previous';
var downPageWord = 'Next';



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

for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp = post.published.$t.substr(0,10);
var title = post.title.$t;
if(isLablePage){
if(title!=''){
if(post.category){
for(var c=0, post_category; post_category = post.category; c++) {
if(encodeURIComponent(post_category.term)==thisLable){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
}
}//end if(post.category){

itemCount++;
}

}else{
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+'T00%3A00%3A00%2B08%3A00&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){
if(isLablePage){
upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
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){
if(isLablePage){
html = labelHtml+'1</a></span>';
}else{
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++;
}
}//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
}//end for(var p =0;p< htmlMap.length;p++){

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

html = '<div class="showpageArea"><span style="COLOR: #000;" class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html;

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

}

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

if(isPage || isFirstPage || isLablePage){
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 src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999"; type="text/javascript"></script>

Eveeet bu iş burada biter 🙂 Sizde artık bloglarınızda bu eklentiyi uygulamış bulunuyorsunuz. Kırmızı renkle gösterdiğim yerleri kendinize göre “İleri,Sonraki,Önceki” diye ayarlayabilirsiniz.Ve birde bu eklentiyi yapmayı başardıktan sonra dua ederseniz çok makbul geçer dostlar 😉 Eğer sorununuz olursa yorum kısmından belirtebilirsiniz.

Bu yazıdan önce yazmış olduğum "Blogger Smiley Eklentisi" başlıklı yazımı da okumanızı tavsiye ederim.

Enes ILHAN

Herkese Merhabalar, ben Enes İLHAN. Gaziantep'te doğdum, Adana'da Büro Yönetimi ve Yönetici Asistanlığı bölümünü okudum ve 2012'de mezun oldum. Askerliğimi uzun dönem olarak, { acemiliği Ankara/Mamak'ta , usta birliğini ise Hatay/İskenderun'da } yapıp bitirmiş bulunmaktayım. Şimdi ise hayata atılmanın çabası içerisine girmiş bulunmakta olup iş bulma derdindeyim.

28 Yorum Yapılmış

  • Vincent

    Benim temada işe yaramadı malesef, 2. kodu uyguladıktan sonra şöle bi hata alıyorum:

    "Düzgün bir şekilde oluşturulmadığından şablonunuz çözümlenemedi. Lütfen tüm XML öğelerinin düzgün biçimde kapatıldığından emin olun.
    XML hata iletisi: The reference to entity "max-results" must end with the ';' delimiter."

  • Enes İLHAN

    @azenerji,
    Ben pek sanmıyorum yavaşlatacağını ama tabi size öyle gelmiş olabilir. Dediğinizde haklılık payı var.Çünkü kodları dikkatle incelersiniz json feed kaynağını görebilirsiniz.

  • King_Wolf Security Pages

    Çok güzel bir eklenti ama ctrl tuşu bozuk çalışamıyorum eve gidince mutlaka uygulayacağım bunu bloğuma teşekürler enesciğim

  • Çağatayca

    aynı hata:
    Düzgün bir şekilde oluşturulmadığından şablonunuz çözümlenemedi. Lütfen tüm XML öğelerinin düzgün biçimde kapatıldığından emin olun.
    XML hata iletisi: The reference to entity "max-results" must end with the ';' delimiter.

  • cosar

    yapılan her yeni kayıt için ayrı bir sayfa numarası vermesi olayı mümkün mü? örneğin blogunuzda 80 tane kayıt var ve sayfa 1 den sayfa 80 e kadar sayfa numarası vermesi durumu?

  • Enes İLHAN

    @cosar,
    Blogunuza baktım gayet başarılı olmuş. Dediğiniz her kayıt için 1 sayfa işlemi şu şekilde olabilir:
    Blogger Drafta girin. Kumanda Paneli'nden Ayarlar bölümüne gelin. Ardından Biçimlendirmeye tıklayın. Orada ana sayfada gösterilecek yazı sayısı var. Onu 1 olarak ayarlarsanız belki her kayıt için 1 sayfa oluşturabilinir.

  • Anonymous

    selamlar cümleten ; aziz kardeşim şu gülücük iconlarını sayfandan kaldırsan ve hem sen rahat konularını paylaşırsın hemde biz anlarız haddimize değil lakin senin engin ve dehşet bilgilerinde yararlanmak istiyoruz bunun için anlamamız lazım 🙂 anlamamız icinde ayrıntıların pürüzlü olmaması lazım 🙂 bilmem anlata biliyormuyum saygılarımla….
    allahın selamı üzerinize olsun .

  • Enes İLHAN

    @Adsız,
    Bu konuyu çok düşündüm fakat ifadesiz kendimi ifade edemiyorum 🙂 Haklısınız belki ama gerçekten birçok eklentiyi şu gülücük eklentisine değişebildim. Çok seviyorum ve nedense bir türlü vazgeçemiyorum. Zaten smiley çıkan yerleri ayrı olarak uplpad edip sizlerin kullanımına sunuyorum. Sizden başka bu konuda sorunu olanı görmedim eğer bu konuda şikayetler artarsa bu eklentiyide sizler için feda etmeye hazırım 😉

  • GÖKHAN

    @Enes;

    Yazını paylaşalı baya olmuş ama ben yeni okuyorum, daha doğrusu yeni uyguluyorum. Gerçekten verdiğin bilgi için teşekkürler. Konu eskimiş ama yinede içimden bi yorum bırakmak geldi.

  • Watch-tr

    konu eksi biraz ama yardım lazım bloguma uyguladım fakat görüntülenecek konu sayısını 8 yapınca 1'den 8.sayfaya atlıyor.5 yapınca 1'den 5 e atlıyor yardım edemisiniz..

  • GünCeraN

    Paylaşımınız için teşekkürler. Gerçekten çok işime yaradı.

    Yalnız şunu ekleyeyim. (Sanırım, coşar'ın bahsettiği şey de buydu.)

    ———————-

    var pageCount = 5;
    var displayPageNum = 5;

    ———————-

    Page Count : Bir sayfada gösterilecek yazı sayısı (max-results)
    Display Page Number : İleride ve geride gösterilecek sayfa sayısı. (Örneğin DPN, 5 ise, 6. sayfada 1'den 11'e kadar sayfa numarası sıralanır.)

    ———————-

    Yeni kullanıcılar, Page Count sayısını kendi güncenizin tek bir sayfasındaki kayıt sayısına göre ayarlamayı unutmayın. (Ben de sonradan farkettim.)

    Hayırlı Ramazanlar…

  • Hakan

    Enes hocam sa.
    Peki bu sayfa numaralandırma da 500 yazı sınırı varmı?
    Ben ekledim siteme 500 yazı sınırına takıldı. Sadece 100 sayfa gösteriyor.
    Bi yardımcı olursan sevinirim

  • TruK

    🙁 Olmadı Dicem Kızıcaksın Enes Kardeşim. Ama Gerçekten Olmadı. Dediklerini Harfiye Uyguladım Ama Nafile. Temamda 2 Adet vardı ikisinde de denedim olmadı.

  • Enes İLHAN

    @TruK
    Estağfurullah neden kızayım. Bu yöntem artık eskidi ve bende bu kodları kullanmıyorum . Yeni yöntemi boş vakit bulduğumda ve en kısa zamanda anlatmayı düşünüyorum, takipte kalınız ve ilginiz için teşekkür ederim..

  • Anonymous

    Enes kardeşim temaya uyguladım eline sağlık. Ama eklentide "sayfam" yazısı var onu nasıl kaldırabilirim? js nin içindede yok o yazı.

  • grafips

    birader bu eklentiyi yaptıktan sonra mesela 2. sayfaya geçtiğimde 'Sorgunuzla eşleşen kayıt yok. Tüm kayıtları göster' diye bi uyarı çıkıyor, bunu nasıl düzeltebiliriz?

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir