Sosyal Ağ Butonları (Şık Ve Güzel)

Sosyal Medya 

Merhaba Arkadaşlar :) 
Bugün Size Bir Kod Verecem Bloglarınız Veya Başka Türlü Sitenizde Kullanmanız İçin Birebir Bir Kod . Sosyal Ağlar Butonu . Zaten Şuan Sitemde Kullanıyorum Demosunu Görürüyorsunuzdur.


Sosyal Medya İkon Kodu :

<div class="abt-social-slide">
<ul>
<li><a class="facebook" href="https://www.facebook.com/eleqantss42" target="_blank">Facebook</a></li>
<li><a class="twitter" href="#" target="_blank">Twitter</a></li>
<li><a class="google-p" href="https://plus.google.com/101598941054360261230/posts" target="_blank">Google plus</a></li>

</ul>
</div>
<style>
.abt-social-slide ul li{list-style:none;border-bottom:none;padding:0}
.abt-social-slide li a{width:59px;height:59px;float:left;text-indent:-99999px;border:solid 1px #222121;border-radius:5px;-webkit-transition:All .3s ease-out;-moz-transition:All .3s ease-out;-o-transition:All .3s ease-out;margin:5px 5px 10px;padding:0}
.abt-social-slide li a.facebook{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_kQX7g5ekYRjR5hoefnMT5VJWDElEWrrIOp6kdFpk2VtUhlu180R12bxTXB2F4WDXGA87OksBal5g_69hBFGKXOH1brUPuNrWwmY03nThRbvD7nkhzTuBZXQjb6jbGKlnJ2j1MmIO4Q/s1600/facebook.png) no-repeat 0 -88px}
.abt-social-slide li a.facebook:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_kQX7g5ekYRjR5hoefnMT5VJWDElEWrrIOp6kdFpk2VtUhlu180R12bxTXB2F4WDXGA87OksBal5g_69hBFGKXOH1brUPuNrWwmY03nThRbvD7nkhzTuBZXQjb6jbGKlnJ2j1MmIO4Q/s1600/facebook.png) no-repeat 0 0}
.abt-social-slide li a.twitter{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghKDxuCCnWqPVFk986G9HlNt8xqjjD7A_5nNbVAMq-nKgU1iypyhaSitvPutLBAguD0X7nMcK3hasb5LrPzLrLvIHf7uH2piC1WfbG8mfWL4TPxPCsmuIZb7s-QLaKLhv4jntG4TsSKg/s1600/twitter-1.png) no-repeat 0 -88px}
.abt-social-slide li a.twitter:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghKDxuCCnWqPVFk986G9HlNt8xqjjD7A_5nNbVAMq-nKgU1iypyhaSitvPutLBAguD0X7nMcK3hasb5LrPzLrLvIHf7uH2piC1WfbG8mfWL4TPxPCsmuIZb7s-QLaKLhv4jntG4TsSKg/s1600/twitter-1.png) no-repeat 0 0}
.abt-social-slide li a.google-p{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRRRUpBxZJpyNRWeBdRH-0q-ISHJ0HbqqbOaV25B_J_lQ7h5O93h5ICxNzKl3ZBjjCyaeq0SZjSfEHFZYV8ZI12mrVatcGDlisW9EkHbr-MurK_BzvWA4nhHzYT74uxNgy1tEWzg0m5w/s1600/google.png) no-repeat 0 -88px}
.abt-social-slide li a.google-p:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRRRUpBxZJpyNRWeBdRH-0q-ISHJ0HbqqbOaV25B_J_lQ7h5O93h5ICxNzKl3ZBjjCyaeq0SZjSfEHFZYV8ZI12mrVatcGDlisW9EkHbr-MurK_BzvWA4nhHzYT74uxNgy1tEWzg0m5w/s1600/google.png) no-repeat 0 0}
.abt-social-slide li a.rss{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivuHkiS3nTfO9Fcb5SVaZeRbcoZ4CbgzpQrrDR5yNGZ-_Hazl1N2VF0dUkrdN1eAbALkNKazgUH0jsZm-Jff_O7w4B-0DFpPvA399Tet7vle_4Qq6Z5ocCvb-8xrB4SE2go5o2pa5uKA/s1600/twitter.png) no-repeat 0 -88px}
.abt-social-slide li a.rss:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivuHkiS3nTfO9Fcb5SVaZeRbcoZ4CbgzpQrrDR5yNGZ-_Hazl1N2VF0dUkrdN1eAbALkNKazgUH0jsZm-Jff_O7w4B-0DFpPvA399Tet7vle_4Qq6Z5ocCvb-8xrB4SE2go5o2pa5uKA/s1600/twitter.png) no-repeat 0 0}
</style>

Bu yazıyı sitenizde/forumunuzda paylaşmak için aşağıdaki linkleri kullanabilirsiniz..

URL:

HTML Link:

Forum Link:

Blogger eklentileri

Etiketler: Blogger

Yazar Hakkında - Berkay Erdinç .

Blogumuz ilk yayınından bu güne , blogger eklentilerini , tüm blogger kullanıcılarına ulaştırmak için yayın yapmış , bu süre içinde hiç bir şekilde kar/gelir elde etmemiş , etmiyecektir..Lütfen desteklerinizi bizden esirgemeyin..

Bizi Facebook ve Twitter üzerinden de takip edebilirsiniz..