FeedBurner Takipçilerinizi Gösterin

Yazar: Ömer Burak | 30 Haz 11 | 5 comments

FeedBurner Takipçilerinizi  Gösterin

Herkese merhaba,

Bildiğiniz gibi FeedBurner ile okuyucularınızın sizi e-posta takip edebileceği bir bölüm oluşturabiliyorsunuz.Toplamda sizi e-posta aboneliği ile takip edenlerin sayısını FeedBurner’in kendi kodları ile anlık sayaç şeklinde gösterebiliyorsunuz.Ancak çok kötü bir görünümü oluyor ve şık tasarımlı sitelere bu görüntü  yakışmıyor.

Bunun yerine takipçi sayınızı gösteren daha gösterişli bir sayaç koymak göze hoş gelecektir.

Son zamanlarda bir çok kişi sitemde yer alan takipçi sayısının nasıl gösterildiğini soruyor.Bunu sadece bir kod ile halletmek mümkün.Bu kodu zamanında nerden bulduğumu hatırlamıyorum.Bu yüzden kodlayan arkadaşın ismini vermediğim için üzgünüm.Eğer bilen kişiler çıkarsa ismini yorum kısmında zikredebilir.Neyse önce kodlarımızla oluşacak sayacımızın küçük bir resmini görelim:

Rss Takipçi Sayısı

Gelelim bunun gözükmesini sağlayan kodlara.

FeedBurner Takipçilerimi Sayı olarak Nasıl Gösteririm?

Aşağıda vereceğim kodu sitemizin uygun bir yerine ekliyoruz.

<style>#abku a:hover #s1{display:none;}#abku a:hover #s2{display:inline;}#d1{background:#ff6600;}#d2{border:1px solid #ff6600;}#d3{background-image:url(http://feeds.feedburner.com/~fc/OmerBurakOzdemir?bg=ffffff&fg=ff6600&anim=0&label=okuyucu);}#abku a:hover #d1{background:#ff2a66;}#abku a:hover #d2{border:1px solid #ff2a66;}#abku a:hover #d3,#abku #dx {background-image:url(http://feeds.feedburner.com/~fc/OmerBurakOzdemir?bg=ffffff&fg=ff2a66&anim=0&label=okuyucu);}#abku a #s2{display:none;}</style>
<div id="abku" style="width:96px;"><a style="text-decoration:none;color:#fff;font-size:11px;font-family:arial;" href="http://feeds2.feedburner.com/OmerBurakOzdemir"><div style="width:96px;"><div id="d1" style="padding-top:7px;height:20px;-moz-border-radius-topleft:10px;-webkit-border-top-left-radius:10px;-moz-border-radius-topright:10px;-webkit-border-top-right-radius:10px;"><center><div id="s1">RSS Aboneliği</div>
<div id="s2">Abone Ol</div></center></div>
<div id="d2" style="padding:3px;-moz-border-radius-bottomleft:10px;-webkit-border-bottom-left-radius:10px;-moz-border-radius-bottomright:10px;-webkit-border-bottom-right-radius:10px;"><div id="d3" style="background-position:-10px -3px;width:76px;background-repeat:no-repeat;height:15px;border-right:10px solid #fff;"></div></div></div></a><div id="dx"></div></div>

Bu kodda yer alan OmerBurakOzdemir yazan yeri kendi FeedBurner kullanıcı adınızla değiştirmeniz gerekmektedir.

background:#ff6600 kısmında yer alan #ff6600 renk kodunu istediğiniz renk kodu ile değiştirdiğiniz zaman turuncu renk değişecektir.
background:#ff2a66 kısmında yer alan #ff2a66 renk kodunu istediğiniz renk kodu ile değiştirdiğiniz zaman pembe renk değişecektir.

px değerleri ile de oynayarak boyutlarını değiştirebilirsiniz.

Kodları az incelediğiniz zaman kendize göre şekillendirebildiğini göreceksiniz.Esen kalın…


5 comments

    1. Kayma derken tam olarak ne kast ettiniz ?Verdiğim kodu ekleyeince konuya eklediğim resimdeki gibi aynen gözükmedi mi ?
      Eğer temaya uygun bir şekilde durmuyor ve temada kayıyıor ise div açıp css ile konumlandırmalısınız.

Bir Cevap Yazın

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