Ikon Sosial Network Berputar Dengan CSS3 Untuk Blogger

Kali ini saya akan Share ke agan-agan Tentang cara membuat icon Sosial Network Berputar pada Blog. Saya selalu berusaha untuk membuat sesuatu yang berbeda yang akan menarik pembaca / pengunjung tutorial quickly.In hari ini kita akan bermain dengan beberapa CSS3 sifat sederhana seperti -moz-transform dan membuat widget sosial sederhana dengan CSS3 widget effect.This berputar pasti akan membantu Anda untuk meningkatkan jumlah pelanggan sosial juga akan menarik pembaca Anda dan pengunjung diperebutkan tikus perhatian quickly.On membawa mereka berputar (berputar) beberapa derajat dan ketika mouse melayang di atas itu mereka kembali ke posisi semula, efek ini disebabkan oleh properti CSS3 yang saya sebutkan above.Now memungkinkan pergi ke tutorial dan melihat bagaimana cara menambahkan mereka ke dalam blog blogger.

ikuti langkah di bawah ini untuk menambahkannya ke blog Anda.

1. Pilih gaya apapun di bawah ini
2. Copy kode
3. Ganti username saya dengan Anda
4. Pergi ke Blogger Dashboard> Layout
5. Klik Tambah Gadget
6. Pilih HTML / JavaScript
7. Paste kode Anda dan menyimpannya.

<style>p#hb_socialicons img {

 /* Spinning Social Icons Widget By Kokoflom */

    -moz-transition: all 0.4s ease-in-out;

    -webkit-transition: all 0.4s ease-in-out;

    -o-transition: all 0.4s ease-in-out;

    -ms-transition: all 0.4s ease-in-out;

    transition: all 0.4s ease-in-out;

}

p#hb_socialicons img:hover {

    -moz-transform: rotate(120deg);

    -webkit-transform: rotate(120deg);

    -o-transform: rotate(120deg);

    -ms-transform: rotate(120deg);

    transform: rotate(120deg);

}

/* Spinning Social Icons Widget By Kokoflom */

</style> 

<center><p id="hb_socialicons">

    <a href="http://www.facebook.com/eckoo.pratama/">

<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhH6X7OMeSktFJKigtFC2xKMBbzJD2A-fTDrQ0YqfCZ2TPO292gjER_Z7tRqLUdQ8x8iuE35hEbYd82p7k-jYqtbG4TVkzAgdrHKUBCp9ffQvCfAfHNy_pPQ8FyA6EgTwLpth_RSGLZTAg/s1600/helperblogger.com-facebook.png" /></a>

    <a href="http://www.twitter.com/eckoo_poetra/">

<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVDkHSoawNpBRQYfGA89jK3-MRZh5W7-1xB3OnXKEHhZhyFG1mFzg53s5Z1GCwtcGd8ceMsSkeip0nySElVag5tGjT4_IgaDYiD1fHHESypISdTslZKBQR2p9ztwPchES-ZODnYbKh6Qo/s1600/helperblogger.com-twitter.png" /></a>

    <a href="https://plus.google.com/u/0/106527290580119996124">

<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNfbNeU1OX0kHdd8I_MHoULZC9bzZWYbH6RF5BywjuddMu6PPRYX4GpX4mJlo0NeCqhab_XF9PEJ45fUYV6JUYdOVEd7ZJ0lAMIueFYUIY019e_CE26cUiXPnwtn9Jc4ZvTOSA1xAV05E/s1600/helperblogger.com-google_plus.png" /></a>

    <a href="http://www.feeds.feedburner.com/kokoflom/">

<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizaMKTpUi5AwbJnCee9hXnQRgW3o0_p6xgWv7BMdCt1RM9rouIb5mOhbZnGB8Ql0Z2dXDHMfTEpCQgaCDec7joodXd6UPSBqJhPuobQJx2YhOtZFdH2LaaD2iR2IXRP1XQg9ZcjUS_-Wg/s1600/helperblogger.com-rss.png" /></a>

    <a href="http://www.youtube.com/kokoflom/">

<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHZiwU3t4cGfheQl24mu8OfpLlNxVE6tjuD65LeJqCSH79Ooh02-rhEWR66cdRU9Dr3b5e5datfIfQihB_YNZLyWRYe7O_yv01Uw5zBc7q0z3UdjFdB8QW4Wc-GicOzfctb83WhMF2KKY/s1600/helperblogger.com-youtube.png" /></a>

</p></center>

Save Widget Nya :)
Thx