İpucu Balonu Tarzında Sosyal Butonlar

Ziyaretçilerinizin, blogunuzu sürekli takip etmelerini sağlaacak sosyal takip butonlarına çok önem veriyorum.Her kesin zevki ve blog tasarımı da farklı olduğu için değişik türlerde ve ytarzlarda sosyal takip butonlarını sizlerle paylaşıyorum.Bugüne kadar paylaştığım sosyal takip butonları eklentilerini hatırlatayım:

İpucu Balonu Tarzında Sosyal Butonlar

 

Sosyal takip butonlara bir yenisini daha ekleyiyorum.Bu eklenti, başlıkta da belirttiğim gibi ipucu balonlarını andıran tarzda ikonlar kullanılarak yapılmış ve CSS zoom tekniği kullanılarak ikonların üzerine gelince büyütme efekti verilmiş.

Hover efektini görmek için videoyu izleyebilirsiniz.

 

 

Eklentiyi blogunuza eklemek Blogger kumanda paneline giriş yaptıktan sonra Yerleşim > Gadget Ekle > HTML/JavaScript yolunu izleikten sonra aşağıdaki kodları ekleyin.

<style>
/* İpucu Balonu Tarzında Sosyal Butonlar  */
.ipucubalonu{
list-style-type:none;
margin:0;
padding:0;
}
.ipucubalonu li{
display:inline;
width: 60px;
height:60px;
}
.ipucubalonu li img{
width: 50px;
height: 50px;
border:0;
margin-right: 4px;
-webkit-transition:-webkit-transform 0.1s ease-in;
-o-transition:-o-transform 0.1s ease-in;
}
.ipucubalonu li img:hover{
-moz-transform:scale(1.8);
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}
</style>

<ul class="ipucubalonu">

<li><a href="http://feeds.feedburner.com/bloghocam" target="_blank"><img src="https://lh4.googleusercontent.com/-28Yl3FJYVoY/UH8VfEToQII/AAAAAAAAEUo/9-kIdmHeGaE/s64/ipucubalonu-rss.png" title="Add RSS Feed" /></a></li>

<li><a href="http://www.facebook.com/bloghocam" target="_blank"><img src="https://lh4.googleusercontent.com/-fkNyrN8QhSw/UH8VfPasifI/AAAAAAAAEUg/1L1SEhaNxrs/s72/ipucubalonu-facebook.png" title="Add to Facebook" /></a></li>

<li><a href="http://www.twitter.com/bloghocam" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgo6coQ6ae_UltXkIX-E0bzHVLJXhPrjLf-gR4sL7QcVxeQC5QINylAadq0ktnilzMp8LkPumjrTNnBGIj4oL_dJeNW6OtyuL7Bfi63jbKmIQpQtWFoPh2E9ITF3hYXKLUkCjXffNifsCvq/s64/ipucubalonu-twitter.png" title="Add to Twitter" /></a></li>

<li><a href="https://plus.google.com/108761595756468128383" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUQb6bVfSArwcV2LTVffFOvbKXOAEid7bvGVaeujwKyAWZlCvdPdTFNolIT3II5PUMcu9-qgiHtq5Pt4zpfkcIUbWuT4aAHP30IWs1Bypyzkyx-Ly2Iz4UUR3n04AW4pHwrPtAuVa4-OTa/s64/ipucubalonu-google.png" title="Add to Facebook" /></a></li>

</ul>

 

Değiştirmeniz gereken yerleri beyaz vurguyla gösterdim.Oralara kendi FeedBurner, Facebook, Twitter ve Google+ hesaplarınızın adreslerini yazın.

6 yorum:

  1. Hocam acaba rengini değiştirebilme şansımız var mı?

    YanıtlaSil
  2. Rengi değil de ikonları değiştirebilirsiniz.

    YanıtlaSil
  3. Hocam blogunun sağındaki sosyal buttonlar da rss kaç gündür sayı göstermiyor.Bende de aynı durum var.Aynı şekilde göstermiyor.Neden olabilir ?

    YanıtlaSil
  4. @CybeR r
    Evet, benim de canımı sıkıyor o durum. Feedburner'dan ya da yazılan scriptten kaynaklanan bir sorun. Biraz daha bekleyeceğim eğer düzelmezse alternatif bir script aramaya başlayacağım.

    YanıtlaSil
  5. teşekkürler çok işime yaradı :D

    YanıtlaSil
  6. Bu yorum yazar tarafından silindi.

    YanıtlaSil

Blogger tarafından desteklenmektedir.