Ana içeriğe atla

Blogger Sayfa Numaralandırma Eklentisi-Page Navi



Açılan ana sayfada görünen içerik sayınızın10 dan fazla olması sayfalarınızın açılmasını yavaşlatacağı bir çok makaleye konu olmuştur.Standart blogger şablonlarının hemen hemen hepsinde sayfa numaralandırılması yapılmamış.Sayfa sonlarında daha eski kayıtlar,daha yeni kayıtlar gibi ilkel görünt sergileyen linklerle sayfa geçişleri sağlanmakta.Bu da şık olmayan bir görüntü sergilemekte.Şimdi sizlere şık bir tasarımı olan sayfa eklentisini nasıl bloğunuza ekliyebileceğinizi anlatalım.


Sayfalrınızın sonuna şekilde gördüğünüz gibi sayfa numaralandırma eklentisini bloğunuza-sitenize eklemenin iki yolu var.Birincisi zor ve güvenli olanı ikincisi ise 3 sn de yapabileceğiniz çok basit olan yöntem.
1.Yöntem(Önerilen)

1.Adım:Tasarım/Html yi düzenleye geliyoruz  ]]></b:skin> yazan yeri (Ctrl+F basıp aratıp kolayca bulabilirsiniz) buluyoruz.Aşşağıdaki kodu bundan önceki kısma yapıştırıyoruz.

.showpageArea {
  font-family:verdana,arial,helvetica;
  color: #000;
  font-size:11px;
  margin:10px;
  }
 
.showpageArea a {
  color: #000;
  text-shadow:0 1px 2px #fff;
    font-weight: 700;
  }
 
.showpageNum a {
  padding: 3px 8px;
  margin:0 4px;
  text-decoration: none;
  border:1px solid #999;
  -webkit-border-radius:3px;-moz-border-radius:3px;
  background: #ddd url
(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp1.jpg) 
0 -50px repeat-x;
  }
 
.showpageNum a:hover {
  border:1px solid #888;
  background: #ccc url
(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp1.jpg) 
0 -25px repeat-x;
  }

.showpageOf{
  margin:0 8px 0 0;
  }

.showpagePoint {
  color:#fff;
  text-shadow:0 1px 2px #333;
  padding: 3px 8px;
  margin: 2px;
  font-weight: 700;
  -webkit-border-radius:3px;-moz-border-radius:3px;
  border:1px solid #999;
  background: #666 url
(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp1.jpg) 
0 0 repeat-x;
  text-decoration: none;
  }
 
2.Adım:Yine Html yi düzenle kısmında  </body> kodunu buluyoruz.Aşşağıdaki kodu bu koddan önceki kısma yapıştırıyoruz.

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord ='ÖNCEKİ';
var downPageWord ='SONTRAKİ';
</script>
<script src='http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js' 
type='text/javascript'/>
</b:if>
Kodu yapıştırdıktan sonra hemen kaydetmeyin, bir önizleme yapın sorun yoksa kaydedin hayırlı olsun.
2.Yöntem (kolay olan)  
İkinci yöntemde kodlara herhengi bir müdahalede bulunmuyorsunuz.BURAYA TIKLAYIN ardından açılan pencerede bilgileri girdikten sonra sırasıyla TAMAM-BLOGUMA EKLE butonlarını tıklayın.Normal bir Gadget ekler gibi bloğunuza ekleyin hayırlı olsun.
(İkinci Yöntem http://bloggermodifiyewidget.blogspot.com alıntıdır.)

Yorumlar

Gerekli dedi ki…
2.Yöntem (kolay olan)  çalışmıyor, eskiden çalışıyordu birden çalışmamaya başladı.
Blog Okulu dedi ki…
eğer çalışmıyorsa;size görüntü olarak daha şık ve animasyonlu olan ve uygulaması çok basit olan  burdaki eklentileri tavsiye ederim.

Bu blogdaki popüler yayınlar

Blogger Arama Kutusu Ekle (Renkli)

Blogunuzdaki içerik sayınız arttıkça zamanla siz bile yazdığınız şeyi blogunuzda bulmak için baya bir vakit harcarsınız, birde blogunuza gelen ziyaretçileri düşünün, bu yüzden blogunuza gelen ziyaretçilerin aradığını rahatlıkla bulabilmesi için blogunuza mutlaka arama kutusu eklemelisiniz.Blogger kullanıcıları blogunuza özel entegrasyonu yapılmış ve temanızın rengine uygun arama kutusunu blogunuza basit bir yöntemle ekleyip ziyaretçilerinizin blogunuzda aradığını anında bulmalarına yardımcı olabilirsiniz. Arama kutularını blogunuza eklemek için: Kumanda Paneli>Tasarım>Gadget Ekle>Html/Javasript yolunu takip edip hangi arama kutusunu blogumuza eklemek istiyorsak aşşağıdaki kodlardan ona ait olan kodu kopyalıyoruz, açılan gadgetimizin içine yapıştırıp kaydediyoruz. 1.Arama Kutusu Stili: <style type="text/css"> #w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjL2qoP6OS9Baq9nf_keINdlxQLx8Nw07fwr-YowYEuE_tFmMaDVXELtSsqyZuM...

Bayraklı Google Translete Kodu-Sitene Dil Kodu

Blogumuza farklı ülkelerden ziyaretçiler gelebilir.Hepimiz dünyanın tüm dillerini okuyup anlayamayız.Yabancı bir blogu ziyaret ettiğimde sayfa linkini kopyalıyorum daha sonra google çevri bölümünden sitenin çevrisini yapıyorum.Fakat her defasında bu işlemi yapmak angarya geliyor kopyala-yapıştır-bekle, bu angaryadan yabancı ziyaretçilerininizi kurtarmanın vakti geldi artık.Sitenize ekleyeceğiniz bayraklı, flash ile yapılmış google translete kodunu sitenize ekleyip gelen ziyaretçilerin  ülkelerinin bayraklarının üzerine tıklayarak sitenizin bütün içeriklerini kendi dillerine çevirebilecekler.Eklentiyi blogubuza eklemek isterseniz. Kumanda Paneli>Tasarım>Gadget Ekle>Html/Javascript yolunu takip edip aşşağıdaki kodu açılan gadgetimizin içine yapıştırıp kaydediyoruz.Ardından bayrakların, blogumuzda görünmesini istediğimiz yerine sürükleyip bırakıyoruz. <style> .google_translate img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0;...

Son Yorumlar Eklentisi-Blogger Son Yorumlar Eklentisi

Bloğunuza yapılan  Son Yorumlar ın bir köşede liste halinde görünmesini sağlayan "Son Yorumlar" Eklentisini  eklemenin çeşitli yöntemleri var.Bugün sizlere "Son Yorumlar" eklentisini bloğunuza nasıl ekliyebileceğinizi  iki yöntemle anlatacağız; 1.Yöntem: Bloğunuzun yönetim panelindeki Tasarım sayfasından "Son Yorumları" Gadget olarak ekleme yöntemi.  2.Yöntem: Bloggerde bulunan bir eklenti üzerinde yapacağımız ufak bir hile ile bloğumuza "son yorumlar" eklentisi ekliyeceğiz. 1.Yöntem: Bloğunuzun yönetim panelindeki Tasarım sayfasından "Son Yorumları" Gadget olarak ekleme yöntemi: Tasarım>Gadget Ekle>Html/Javascript Gadgetini seçiyoruz.Başlık olarak "Son Yorumlar" yada isteğinize göre bir başlık yazabilirsiniz.Başlığımızı yazdıktan sonra aşşağıdaki kodu kopyalayıp gadgete yapıştırıyoruz.Burda dikkat etmemiz gereken nokta kırmızıyla yazdığımız yere kendi site adresinizi yazmanız. <script style="text/javascrip...