Numaralı Sayfa Navigasyonu

 Blogunuzun görünümünü daha da güzelleştirmeniz için uygulayabileceğiniz bir şey daha var tabi ki de numaralı sayfa navigasyonundan bahsediyorum.Eski blogger tarzları gibi "daha eski kayıtlar" "daha yeni kayıtlar" yerine sayfanız'da daha rahat dolaşılmasını sağlayacak numaralı sayfa navigasyonunu blogunuza entegre etmelisiniz.

numarali navigasyon

Peki Nasıl Eklerim?

Blogger >> Şablon >> Html'yi Düzenle ve ctrl+f yapıp ]]></b:skin> kodumuzu buluyoruz.

]]></b:skin> kodumuzun hemen üstüne aşağıdaki kodları ekliyoruz.

Kodlar

.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; 
}



Daha sonra </body> kodumuzu bulup ve üstüne aşağıdaki kodları ekliyoruz.

Kodlar;



<b:if cond='data:blog.pageType != &quot;item&quot;'>

<script type='text/javascript'>

var pageCount=5;

var displayPageNum=5;

var upPageWord ='Previous';

var downPageWord ='Next';

</script>

<script src='http://dl.dropbox.com/u/60346665/blogger-numaralandirma.js' 

type='text/javascript'/>

</b:if>


Yorumlar