Blogger Renkli Sosyal Medya Eklentisi

Blogger sayfanız için rekli sosyal medya eklentisi ile sitenize renk katar hemde oldukça şık bir eklenti.Kullanımı oldukça basit bir eklenti olup aşağıda verceğim yolu izleyerek ve içindeki değişicek yerleri kendinize göre değiştirerek kullanabilirsiniz.

Blogunuzun yönetim panelinden Yerleşim >> Gadget Ekle >> HTML/JavaScript yolunu izleyerek açılan pencerede aşağıdaki kodları ekleyiniz.

Kırmızı ile belirtilmiş yerleri kendinize göre düzenleyin.

<div class="btnt-chronicl-social">
<ul>
<li><a class="rss" href="http://feeds.feedburner.com/eklentiblogger">Rss ile takip edin</a></li>
<li><a class="twitter" href="https://twitter.com/eklentiblogger">Twitter ile takip edin</a></li>
<li><a class="facebook" href="https://www.facebook.com/eklentiblogger">Facebook ile takip edin</a></li>
<li><a class="google" href="https://plus.google.com/u/0/b/101110372634917065358/">Google+ ile takip edin</a></li>
<li><a class="linkedin" href="http://in.linkedin.com/in/eklentiblogger">LinkedIn ile takip edin</a></li>
<li><a class="youtube" href="http://www.youtube.com/user/eklentiblogger">YouTube ile takip edin</a></li>
</ul>
</div>
<style type='text/css'>
/*<![CDATA[*/ 
.btnt-chronicl-social {  width: 280px;  margin: -10px;  }
.btnt-chronicl-social ul {  margin: 0;  padding: 0;  }
.btnt-chronicl-social ul li {  list-style:none;   padding: 0; text-transform: none; }
.btnt-chronicl-social ul li a {   color: #fff;   display:block;  }
.btnt-chronicl-social ul li a:hover {  color: #c9c9c9;  background-color: #333;   }
.btnt-chronicl-social ul li .rss { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/RSS-1.png") no-repeat scroll 10px center #F87E12; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .twitter { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/Twitter.png") no-repeat scroll 10px center #4CACEE; background-size: 20px; padding: 17.5px 45px;}
.btnt-chronicl-social ul li .facebook { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/Facebook-1.png") no-repeat scroll 10px center #3B5998; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .google { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/google.png") no-repeat scroll 10px center #D44937; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .linkedin { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/LinkedIn-1.png") no-repeat scroll 10px center #3692C3; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .youtube { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/Youtube-1.png") no-repeat scroll 10px center #C6312B; background-size: 20px;  padding: 17.5px 45px; }
/*]]>*/
</style>

Blogger Renkli Sosyal Medya Eklentisi Demo