Fun For Việt Nam

Sự tiến bộ, phát triển truyền thông của các mạng xã hội  như G+, Facebook, twitter ...   ngày càng được mọi người quan tâm và tích hợp lên web, blog cá nhân. Vì thế người ta đã cho ra đời hàng chục các công cụ đẹp mắt về các dịch vụ chia sẻ xã hội này. Được biết các blogger hiện nay phụ thuộc phần lớn vào các mạng như Facebook, Google plus và twitter thu hút độc giả và hướng họ tới web hay blog cá nhân của mình. Và công cụ mình sắp hướng dẫn tới hi vọng có thể giúp các bạn tăng số người hâm mộ cũng như độc giả cho web,blog của mình. Và mình xin giới thiệu tên công cụ đó chính là  "Touch Me". Tại sao tên gọi của nó lại như vậy? Bởi vì  khi di chuột qua nó nhìn thật hấp dẫn khiến người ta tò mò và có nhiều khả năng mọi người sẽ di chuột qua các biểu tượng và nhấn theo!  Tiện ích sử dụng các nút từ các dịch vụ phổ biến như Google Plus, Facebook, Twitter và RSS và được mã hoá nó gọn gàng bằng cách sử dụng HTML và  CSS. Và sau đây, để đưa tiện ích lên blog của mình các bạn làm theo hướng dẫn của mình nha!

Demo

<style>
/*--------Touch Me Sharing Widget ------*/
.touchme a {
display:block;
height:50px;
width:50px;
padding:0 4px;
float:left;
background:transparent url(http://trollfile.googlecode.com/files/Sharing%20Touch%20Me.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'>
<!--RSS-->
<a class='rss' href="LINK RSS CỦA BẠN" rel='external nofollow' target='_blank'></a>
<!--Google Plus-->
<a class='googleplus' href="LINK GOOGLE PROFILE CỦA BẠN" rel='external nofollow' target='_blank'></a>
<!--Facebook-->
<a class='facebook' href="LINK FACEBOOK CỦA BẠN" rel='external nofollow' target='_blank'></a>
<!-- Twitter -->
<a class='twitter' href="LINK TWITTER CỦA BẠN" rel='external nofollow' target='_blank' ></a>
</div>