Blogger Toplam Konu ve Yorum Eklentisi (Resimli Anlatım)

Öncelikle merhabalar arkadaşlar bugün kendi siteme eklediğim toplam konu ve yorum eklentisini sizlere sunacağım, gayet kullanışlı ve güzel duruyor, hemen görüntüsünü gösteriyorum:

Evet görüntüyü blogum'un sağ alt tarafında göreceksiniz.

Hemen bu eklentinin kodunu veriyorum:

<script style="text/javascript"> function numberOfPosts(json) {document.write('<b>' + json.feed.openSearch$totalResults.$t + '</b><br>');} function numberOfComments(json) {document.write('<span class="Apple-style-span" style=""></span> <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');} </script><div class='box'><div class='cell_1 konu-sayısı'><img class='icon' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyDce5uAWRPVvyAqTTUr8nBRw_R9DYJ1CGq5SkWB-b_x3wF4pyB3_RT_8bPjSheQ2f3fc9Ljz-Xnfv2o6he09MBFYsGpKGWSbnhu7WibGGZ9YuDLbzyjpyHq4zOm8stxbh-LDnowH176k/s1600/konusayisi.png.png'/></div><div class='cell_2'>Toplam Konu</div><div class='cell_3 '><span class='count' id='rss'/><script src="http://googlehocam.blogspot.com/feeds/posts/default?alt=json-in-script&callback=numberOfPosts"></script></span></div></div><div class='box'><div class='cell_1 yorum-sayısı'><img class='icon' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgg4lye07vq_nx7ntlWaus5-qEsBHe7Xm9NSk7lrpmRv8Ce6YvGC8VsvOXpMtXcAhF75RMYETHg35cLjdz4-hk-x7XNQgZhepJl1TEX9xCyHaVVLrJFGaD7IZjIdwSOaqXVu5IyCrx8c-4/s1600/yorumsayisi.png'/></div><div class='cell_2'>Toplam Yorum</div><div class='cell_3 '><span class='count' id='rss'/><script src="http://googlehocam.blogspot.com/feeds/comments/default?alt=json-in-script&callback=numberOfComments"></script></span></div></div><style type='text/css'>.box:hover{filter:alpha(opacity=85);-moz-opacity:.85;opacity:.85;}.box img{border:0;padding:0;}.icon {width: 27px;height: 26px;margin-top:3px;border: none;}.konu-sayısı {background-color: #44B8F2;background-image: -moz-linear-gradient(top, #96DCFF, #2BA6E3);background-image: -ms-linear-gradient(top, #96DCFF, #2BA6E3);background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#96DCFF), to(#2BA6E3));background-image: -webkit-linear-gradient(top, #96DCFF, #2BA6E3);background-image: -o-linear-gradient(top, #96DCFF, #2BA6E3);background-image: linear-gradient(top, #96DCFF, #2BA6E3);background-repeat: repeat-x;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFA461', endColorstr='#E8711A');border-color: #da7c0c;color: #fff;text-shadow: 0 1px 1px rgba(60, 60, 60, 0.75);}.yorum-sayısı {background-color: #F78634;background-image: -moz-linear-gradient(top, #FFA461, #E8711A);background-image: -ms-linear-gradient(top, #FFA461, #E8711A);background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#FFA461), to(#E8711A));background-image: -webkit-linear-gradient(top, #FFA461, #E8711A);background-image: -o-linear-gradient(top, #FFA461, #E8711A);background-image: linear-gradient(top, #FFA461, #E8711A);background-repeat: repeat-x;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFA461', endColorstr='#E8711A');border-color: #da7c0c;color: #fff;text-shadow: 0 1px 1px rgba(60, 60, 60, 0.75);}.box{font-family: "lucida grande",tahoma,verdana,arial,sans-serif;font-size: 17px;line-height: 14px;list-style-type: none;display: inline-block;padding: 0px 0px;margin:2px 5px ;color: #333;text-align: center;text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);filter: shadow(color=#000000,direction=135,strength=5);text-decoration: none;vertical-align: middle;background-color: #f5f5f5;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#E6E6E6'); /* for IE */background-image: -moz-linear-gradient(top, #ffffff, #E6E6E6);background-image: -ms-linear-gradient(top, #ffffff, #E6E6E6);background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#E6E6E6));background-image: -webkit-linear-gradient(top, #ffffff, #E6E6E6);background-image: -o-linear-gradient(top, #ffffff, #E6E6E6);background-image: linear-gradient(top, #ffffff, #E6E6E6);background-repeat: repeat-x;border-color: #E6E6E6 #E6E6E6 #BFBFBF;border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);border: 1px solid #CCC;border-bottom-color: #B3B3B3;-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);cursor: pointer;position: relative;margin-left: -1px;float: left;line-height: 20px;float:left;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;}.col_4{float:left;}.cell_1{float:left;width:40px;height:30px;padding:0px 0 0 ;margin-left: 0;}.cell_2{border-right:1px solid#ddd;float:left;width:186px;height:25px;text-align:center;padding:5px 0 0 ;}.cell_3{float:left;width:50px;height:25px;text-align:center;padding:4px 0 0 ;}</style>

Bu kodu Yerleşim > Gadget Ekle > HTML/JavaScript ekle ile yapacağız.

Bilen bilir zaten ama ben size yinede resimli anlatmak istiyorum

İlk önce Yerleşime giriyoruz.

Daha sonra Gadget Ekle Diyoruz.

HTML/JavaScript tıklıyoruz ve çıkan sayfaya kodumuzu ekliyoruz..

Önemli Not: Verdiğim koddaki kırmızı yerleri sitenizin adına göre değiştirmeyi unutmayınız !

İşlem tamamdır, yapamayan olursa yorum yazması yeterli olacaktır.

Her daim yardım ederiz, kolay gelsin..