Ziyaretçilerinizin, blogunuzu veya sitenizi sürekli takip etmelerini sağlayacak 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 tarzlarda sosyal takip butonlarını sizlerle paylaşıyorum.
Ayrıca eklemeliyim ki bu butonlar üzerine gelince büyüyorlar.
Öncelikle Css kodlarını yazalım:
/* Sosyal Butonlar */
.ipucubalonu{
list-style-type:none;
margin:0;
padding:0;
}
.ipucubalonu li{
display:inline;
width: 60px;
height:60px;
}
.ipucubalonu li img{
width: 30px;
height: 30px;
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);
}
/* Sosyal Butonlar */
Css kodlarımızdan sonra Html kodlara geçelim:
<ul>
<li><a href=”http://www.bideneal.com/index.php?route=feed/google_base” target=”_blank”><img src=”http://www.bideneal.com/image/ipucubalonu-rss.png” /></a></li>
<li><a href=”https://www.facebook.com/pages/Bideneal/285463298233099?ref=hl” target=”_blank”><img src=”http://www.bideneal.com/image/ipucubalonu-facebook.png” /></a></li>
<li><a href=”https://twitter.com/bideneal” target=”_blank”><img src=”http://www.bideneal.com/image/ipucubalonu-twitter.png” /></a></li>
<li><a href=”https://plus.google.com/100792917573276983849/posts?hl=tr” target=”_blank”><img src=”http://www.bideneal.com/image/ipucubalonu-google.png” /></a></li>
</ul>
yukarıda kırmızı ile işaretlediğim yerleri kendi adreslerinizi yazarak kullana bilirsiniz.
