Sitenize Dinamik Sosyal Medya İkon Butonları Ekleyin Kodu- HTML KOD CANAVARI

Sitenize Dinamik Sosyal Medya İkon Butonu Eklemek ister misiniz?Son derece Şık Olan Bu İkon 
Butonu Sitenizin havasına Hava katacak.
Kod :Css ve Html ile hazırlanmış olup Öncelikle Sitenizin Üst Bölümünde Bir yere gadget ekle den
Html-Javascript ekleden Html Kısmına html kodumuzu ekliyoruz
Sonra Şablonlara gelip Özelleştir diyoruz.En alt kısımda bulunan Css Ekle yede Css kodumuzu ekliyoruz,
Sonrasında ise çok şık olan bu sosyal medya ikonu sitenizde gadgetinizin olduğu yerde gözüküyor,Yazımın sonuna gelirken unutmadan 
Google +,Facebook,Pinterest,Linkedn,Youtube linklerinizi  ...BURAYA GİRİNİZ Yazan yere linkleri değiştiriyoruz.


Dinamik Sosyal Medya Butonları 
ÖNİZLEME

• RSS Takip Adresi
• Google+
• Facebook
• Twitter
• Pinterest
• YouTube
• LinkedIn

HTML KOD

<div class="exsprite"> <ul> <li><a class="icon rss" href="https://www.blogger.com/Buraya%20Rss%20Takip%20Adresiniz/">RSS Takip Adresi</a></li> <li><a class="icon google" href="https://www.blogger.com/Buraya%20Google%20Adresiniz/">Google+</a></li> <li><a class="icon facebook" href="https://www.blogger.com/Buraya%20Facebook%20Adresiniz/">Facebook</a></li> <li><a class="icon twitter" href="https://www.blogger.com/Buraya%20Twitter%20Adresiniz/">Twitter</a></li> <li><a class="icon pinterest" href="https://www.blogger.com/Buraya%20Pinterest%20Adresiniz/">Pinterest</a></li> <li><a class="icon youtube" href="https://www.blogger.com/Buraya%20Youtube%20Adresiniz">YouTube</a></li> <li><a class="icon linkedin" href="https://www.blogger.com/Buraya%20Linkedn%20Adresiniz">LinkedIn</a></li> </ul> </div> <a target="_blank" href="http://htmlkodcanavari.blogspot.com" style="font-size: 6pt; text-decoration: none">Html Kodları,Dinamik Sosyal Medya Butonları,Css Kodlar,+1000 kodlar,Javascript kodlar</a>

CSS KOD

.exsprite {width: 500px;height: 50px;} .exsprite ul li {cursor: pointer;height: 48px;position: relative;list-style-type: none;float: left;} .exsprite .icon { background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZO60rQ7lW6RUIyO_I8tRLatE6d6KlgyREwR-xaZvDndU-FjwUW29HiWZQ-JIoFfB-PaYUX_WtwOSeIcn7_PiNBh_DYt-LCfk2sE-VH8d-PPQQRAJgjV9hZG4F5oL8yAUV-2dGZYay1B_O/s1600/html+kod+canavar%C4%B1+sosyal+media+iconlar%C4%B1.png') 0 0 no-repeat;display: block;float:none;height: 48px;line-height: 48px;margin: 5px 0;position: relative;text-align: left;text-indent: 60px;text-shadow: #333 0 1px 0;white-space: nowrap;width: 48px;z-index: 5; -webkit-transition: width .3s ease-in-out, background-color .3s ease-in-out; -moz-transition: width .3s ease-in-out, background-color .3s ease-in-out; -o-transition: width .3s ease-in-out, background-color .3s ease-in-out; transition: width .3s ease-in-out, background-color .3s ease-in-out; -webkit-box-shadow: rgba(0, 0, 0, .28) 0 2px 3px;-moz-box-shadow: rgba(0, 0, 0, .28) 0 2px 3px;-o-box-shadow: rgba(0, 0, 0, .28) 0 2px 3px;box-shadow: rgba(0, 0, 0, .28) 0 2px 3px;text-decoration: none; font-family: 'Open Sans', Helvetica, Arial, sans-serif;font-weight: bold; color: #fafafa; overflow: hidden; border-radius: 30px; } .exsprite li:hover .icon {width: 150px;} .exsprite .facebook {background-color: rgba(45, 118, 185, .42);background-position: 0 -382px;} .exsprite li:hover .facebook {background-color: #2d76b9;background-position: 0 2px;} .exsprite .twitter {background-color: rgba(0, 161, 223, .42);background-position: 0 -430px;} .exsprite li:hover .twitter {background-color: #00A1DF;background-position: 0 -46px;text-indent: 66px;} .exsprite .google {background-color: rgba(167, 0, 0, .42);background-position: 0 -478px;} .exsprite li:hover .google {background-color: #A70000;background-position: 0 -94px;text-indent: 65px;} .exsprite .pinterest {background-color: rgba(204, 0, 0, .42);background-position: 0 -526px;} .exsprite li:hover .pinterest {background-color: #C00;background-position: 0 -142px;} .exsprite .linkedin {background-color: rgba(0, 87, 114, .42);background-position: 0 -574px;} .exsprite li:hover .linkedin {background-color: #005772;background-position: 0 -190px;} .exsprite .youtube {background-color: rgba(170, 0, 0, .42);background-position: 0 -670px;} .exsprite li:hover .youtube {background-color: #A00;background-position: 0 -286px;} .exsprite .rss {background-color: rgba(255, 109, 0, .42);background-position: 0 -718px;} .exsprite li:hover .rss {background-color: #EC5601;background-position: 0 -334px;text-indent: 55px;} <a target="_blank" href="http://htmlkodcanavari.blogspot.com" style="font-size: 6pt; text-decoration: none">Html Kodları,Dinamik Sosyal Medya Butonları,Css Kodşar,+1000 kodlar,Javascript kodlar</a>


Yapamayan Arkadaşlar Yorumlar aracılığıyla ulaşıp sitelerinin adresini yazarlarsa yardımcı olabilirim arkadaşlar