Hareketli Sosyal Ağ Butonları

Hareketli Sosyal Ağ Butonları

blogger sosyal paylaşım
Merhaba
Bloğunuzun yönetim panelinden HTML/Javascriptekleme yardımı ile aşağıdaki kodu kaydederek çok basit bir şekilde facebook, twitter, google plus, rsspaylaşımları için gayet hoş görünen hareketli sosyal ağ butonları ekleyebilirsiniz.
Blogger hareketli sosyal ağ butonları  bloğunuza uygulamak için ;




sosyal paylaşım butonları eklentisi


Blogger kumanda paneli > Yerleşim > Gadget Ekle > HTML/Javascript dedikten sonra açılan boş sayfaya aşağıdaki kodları ekliyoruz.

<style>
.touchme a {
display:block;
height:50px;
width:50px;
padding:0 4px;
float:left;
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS9oCIIWiHUs5IaQVvyNn4tVZo17IG3-Bi68HBt_I6ZeH2UPdpMSga479BWyBxKAdXK5Pn1WSZM4khZm2l5Iq0YwX6rIddL0BRgsoghP7uDJt8WAX2KNmERR909rI4HTEvjjTKAPXmPp4/w48-h454-no/blogdolusu.blogspot.com.png) no-repeat;
-webkit-transition: ease-in 0.2s all;   
-moz-transition: ease-in 0.2s all;   
-o-transition: ease-in 0.2s all;   
-ms-transition: ease-in 0.2s all;   
transition: ease-in 0.2s all;
cursor:pointer;
}

.touchme a.googleplus {
background-position: 0px -58px;
}
.touchme a.googleplus:hover {
background-position: 0px 0px;
}

.touchme a.twitter {
background-position: 0px -290px;
}
.touchme a.twitter:hover {
background-position: 0px -232px;
}
.touchme a.facebook {
background-position: 0px -406px;
}
.touchme a.facebook:hover {
background-position: 0px -348px;
}

.touchme a.rss {
background-position: 0px -174px;
}
.touchme a.rss:hover {
background-position: 0px -116px;
}

</style>

<div class='touchme'>
<!--Facebook-->
<a class='facebook' href="http://www.facebook.com/pages/Blogdolusu/17171717171717" rel='external nofollow' target='_blank'></a>
<!-- Twitter -->
<a class='twitter' href="https://twitter.com/Blogdolusu" rel='external nofollow' target='_blank' ></a>
<!--Google Plus-->
<a class='googleplus' href="https://plus.google.com/u/0/112351421647813063145" rel='external nofollow' target='_blank'></a>
<!--RSS-->
<a class='rss' href="http://feeds.feedburner.com/blogdolusu" rel='external nofollow' target='_blank'></a>

</div>
 


*Kırmızı ile yazılı olan Facebook, Twitter, Google Plus ve Rss adreslerini kendinize göre değiştirmelisiniz. Güle güle kullanın..

0 yorum: