Cara Membuat Widget Share Keren Untuk Blogger

Blazer Blog, Widget - Cara Membuat Widget Share Keren Untuk Blogger, kali ini saya akan membahas bagaimana Cara Membuat Widget Share Keren Untuk Blogger, widget share kali ini sangat sepcial karena saat pointer di arahkan pada icon secara otomatis icon tersebut akan berganti. Untuk lebih jelasnya lagi silahkan lihat gambar di bawah ini.

Cara Membuat :

1. Login ke Blog kamu.

2. Add Gadget, pilih HTML JavaScript.

3. Copy kode di bawah ini.

<style>
/*--------Touch Me Sharing Widget ------*/
.touchme a {
display:block;
height:50px;
width:50px;
padding:0 4px;
float:left;
background:transparent url(http://mybloggertricks.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="YOUR RSS LINK" rel='external nofollow' target='_blank'></a>
<!--Google Plus-->
<a class='googleplus' href="YOUR GOOGLE PROFILE LINK" rel='external nofollow' target='_blank'></a>
<!--Facebook-->
<a class='facebook' href="YOUR FACEBOOK PAGE" rel='external nofollow' target='_blank'></a>
<!-- Twitter -->
<a class='twitter' href="YOUR TWITTER PAGE" rel='external nofollow' target='_blank' ></a>
</div>

Simpan dan lihat hasilnya.