Blogger Toplam Yazı ve Yorum İstatistik Eklentisi

blogger-istatistik-eklentisi

  Blogger altyapısı ile blog yazanlar gerekli istatistikleri zaten takip edebiliyorlar ama buradaki amaç ziyaretçilere blogunuz hakkında bilgi sunmaktır. Ne kadar yazı yazmışsınız, ne kadar yorum almışsınız ve blogunuz ne kadar görüntüleme almış  gibi detayları sunarak ne kadar tercih edilen bir sayfa olduğunuzu anlatmış olabilirsiniz. Google da arama yaptığınızda bir çok kod çıkıyor ama ben kendi blogumda kullandığım ve sadeliğini beğendiğim istatistik eklentisini paylaşmak istiyorum.

İstatistik Eklentisini Nasıl Eklerim?

  İlk önce yapılacak şey Blogger kumanda panelinden yerleşim sekmesinden "Gadget Ekle" bölümünden "Blog İstatistikleri" eklentisini ekliyoruz. Eklentiyi eklerken başlık verirseniz sonraki aşamalarda bulmanız daha kolay olur. Buradan sonraki aşama vereceğim kodlarla toplam yazı, toplam yorum ve sayfa görüntüleme şekline getirmektir.

  Şablon, HTML'yi Düzenle sekmesinden Ctrl+F yardımı ile İstatistik için verdiğiniz başlığı aratmanız ve yerine aşağıdaki kodu eklemeniz gerekiyor.

<b:widget id='Stats1' locked='false' title='Blog İstatistikleri' type='Stats' version='1' visible='true'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<!-- Content is going to be visible when data will be fetched from server. -->
<div expr:id='data:widget.instanceId + &quot;_content&quot;' style='display: none;'>
<!-- Counter and image will be injected later via AJAX call. -->
<b:if cond='data:showSparkline'>
<img alt='Sparkline' expr:id='data:widget.instanceId + &quot;_sparkline&quot;' height='30' src='http://2.bp.blogspot.com/-nsxCtkYnchQ/VLEifAyf97I/AAAAAAAAIlk/9Viyy0W9r04/s1600/FFF.png' title='Sparkline' width='75'/>
</b:if><b:if cond='data:showGraphicalCounter'>
<span class='counter-wrapper graph-counter-wrapper' expr:id='data:widget.instanceId + &quot;_totalCount&quot;'/>
<b:else/>
<span class='counter-wrapper text-counter-wrapper' expr:id='data:widget.instanceId + &quot;_totalCount&quot;'/>
</b:if>
<script type='text/javascript'>
function postCount(json){
document.write(&quot;<span class='counts post2'> Total Posts &quot;);
var count = json.feed.openSearch$totalResults.$t;
document.write(&quot;<span class='count'>&quot; + count + &quot;</span>&quot;);
document.write(&quot;</span>&quot;)
}
function numberOfComments(json){
document.write(&quot;<span class='counts comment'> Total Comments &quot;);
var count = json.feed.openSearch$totalResults.$t;
document.write(&quot;<span class='count'>&quot; + count + &quot;</span>&quot;);
document.write(&quot;</span>&quot;)
}
</script>
<script src='/feeds/posts/default?alt=json-in-script&amp;amp;max-results=0&amp;amp;callback=postCount' type='text/javascript'/>
<script src='/feeds/comments/default?alt=json-in-script&amp;amp;max-results=0&amp;amp;callback=numberOfComments'/>
</div>
</div>
</b:includable>
</b:widget>
Bu işlemi tamamladıktan sonra </Head> kodundan önce aşağıdaki kodu ekleyin.
<link href='//fonts.googleapis.com/css?family=PT+Sans:400,700' rel='stylesheet' type='text/css'/>
<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' rel='stylesheet'/>
<style type='text/css'>
/* BlogTecrübem den özel blog istatistikleri widgeti  */
.Stats img {display:none!important;background-image:none;}
.Stats .counter-wrapper {width:92%;text-align:right;margin:10px;line-height:35px;color:#333;font-weight:700;font-size:16px;margin-left: 0;}
.Stats .counter-wrapper:after {content:&quot;Page Views&quot;;float:left;text-align:left;font-size:13px;font-weight:700;color:#333;}
.counts {display:inline-block;width:92%;font-size:13px;line-height:35px;color:#333;font-weight:700;}
.counts .count {display:inline-block;font-size:16px;height:30px;
vertical-align:top;direction:ltr;float:right;color:#333;font-weight:700!important;}
.counts:hover .titles:before {color:#333!important;border-radius:2px;border-color:rgba(255,255,255,0.1);}
.counter-wrapper.text-counter-wrapper:before, .counts:before {display:inline-block;font-size:13px;font-family:FontAwesome;font-style:normal;font-weight:normal;margin:0 10px 0 10px;float:left;width:10px;text-align:center;}
.counter-wrapper.text-counter-wrapper:before, .counts:before {
display:block;background-color:#fff;color:#333;width:35px;height:35px;font-size:18px;line-height:35px;border-radius:2px;margin:0px 8px 0 0;}
.counter-wrapper.text-counter-wrapper:before {content:&quot;\f06e&quot;;}
.counts.post2:before {content:&quot;\f044&quot;;}
.counts.comment:before {content:&quot;\f0e6&quot;;}
#Stats1_content {width:auto;height:auto;background-color:#fff;}
</style>

  Eklenti kurulumu aşamalar halinde bu kadar. Ancak eklediğiniz kod İngilizce yazacağından isterseniz Türkçeleştirebilirsiniz.

Nasıl Yaparım?

  İlk eklediğiniz kod içinde total posts ve total comments yazılarını bulun ve değiştirin. Page Views bölümünü değiştirmek için </Head> tagından önce eklediğiniz kod içinde bulun ve Sayfa görüntüleme olarak değiştirin. Değiştirdiğinizde aşağıdaki gibi olacaktır.



Bu yazı Doğuş Hakan Yılmaz - Seo Teknikleri ve Blog İpuçları tarafından yazılmıştır.

YAZIYI PAYLAŞ

BENZER YAZILAR

SONRAKİ
« Prev Post
ÖNCEKİ
Next Post »

10 yorum

yorum YAZ
30 Ocak 2017 14:45 delete

Merhaba ;

Bloğunuzu ilgi ile takip ediyorum. Çok faydalı içerikler paylaşıyorsunuz. Bloğunuz'dan para kazanmak için %50 Komisyon ile İnstaKitap Setine Satış Ortağı Olabileceğinizi Biliyor Musunuz ? https://goo.gl/iLiflK

İnstakitap İnstagram üzerinden para kazanmanın kitabı para kazanmanın tüm metotları, butik açmak, satış yapmak, takipçi artırmak, 4 ayrı kazanç metodu.
Herkese hitap eden yöntemler, sürekli güncellenen tedarikçiler, hepsi 3'lü kitap setinde. Sitemize gelen 100 ziyaretçiden 1'i sipariş veriyor.

Sizi de satış ortaklarımız arasında görmekten memnuniyet duyarız.

Cevap Ver
avatar
30 Ocak 2017 15:09 delete

Ben de bunu arıyordum, hemen deneyeceğim :) Çok teşekkürler :)

Cevap Ver
avatar
30 Ocak 2017 19:05 delete

Rica ederim, bende kullandığım için memnunum..

Cevap Ver
avatar
30 Ocak 2017 19:08 delete

Teşekkürler, inceledim instakitap hizmetini..Ben şu an ilgilenmesemde belki başkaları değerlendirebilir..

Cevap Ver
avatar
31 Ocak 2017 23:22 delete

Bu tür eklentilerin blogları yavaslattigini duymustum. Bilmem ne kadari dogru tabi.

Cevap Ver
avatar
31 Ocak 2017 23:40 delete

Fazladan koyulan her kod siteyi yavaşlatır tabi. Herkes kendi bloguna göre gerekli gördüğü eklentiler ile yetinirse yavaşlatmaz. Benim blog sayfam 5 saniyenin altında açıldığını söyleyebilirim.

Cevap Ver
avatar
1 Şubat 2017 05:04 delete

Bende kullanıyorum bu eklentiyi gayet güzel bir eklenti..

Cevap Ver
avatar
1 Şubat 2017 10:44 delete

Aynen, sade ve kullanışlı gerçekten..

Cevap Ver
avatar
1 Şubat 2017 20:42 delete

kod hata veriyor, yardım ederseniz sevinirim. kod için teşekkürler!

Cevap Ver
avatar
1 Şubat 2017 21:41 delete

Nasıl bir hata veriyor..Yazdıklarımı aynen uygularsanız hata vermemesi lazım. Benim sayfamda da aynısı var.

Cevap Ver
avatar

YORUM YAPARAK KATKIDA BULUNABİLİRSİNİZ...

1) Yaptığınız yorumun, yazıyla alakalı olmasına özen gösteriniz.
2) Yazım ve dil bilgisi kurallarına mümkün olduğunca dikkat ediniz.
3) Kullandığınız üslubun sizi yansıttığını unutmayınız. EmoticonEmoticon