Widget Share Spinning

Widget Share Spinning Dengan CSS - Kali Ini Saya Akan Posting Tentang Widget Share Spinning, Sebenernya Sudah Ribuan Widget Share Social Yang Ada, Tapi Kebanyakan Pakai JavaScript, Tapi Sekarang Sobat Tidak Usah Bingung Lagi Karena  Share Tutorialnya

Widget Share Spinning Ini Ringan Dan Fast Loading Karena Hanya Menggunakan CSS, Images Dan HTML

Demo

Bagaimana ?, Menarik Kan ?
Berikut Tutorialnya :

• Login Blogger
• Klik Template
• Edit HTML
• Cari Kode  <data:post.body/>
• Copy Kode Dibawah, Kemudian Taruh Dibawah Kode  <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<style>

p#socialicons img {

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

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

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

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

transition: all 0.2s ease-in-out;} 

p#socialicons img:hover {

   -moz-transform: rotate(360deg);

   -webkit-transform: rotate(-360deg);

   -o-transform: rotate(-360deg);

   -ms-transform: rotate(-360deg);

transform: rotate(-360deg);}

</style>

<center>

<p id='socialicons'>

<a expr:href='&quot;http://plus.google.com/share?url=&quot; + data:post.url' rel='external nofollow' target='_blank'><img border='0' src='http://1.bp.blogspot.com/-ol6vM16wlA8/UExXvhfRyRI/AAAAAAAAAOY/GadwDGdUteU/s1600/google_plus.png'/></a>

<a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='external nofollow' target='_blank'><img border='0' src='http://2.bp.blogspot.com/-NvtmaRUy-vc/UExXu11rG4I/AAAAAAAAAOE/7-yMkh0TyJQ/s1600/facebook.png'/></a>

<a expr:href='&quot;http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img border='0' src='http://3.bp.blogspot.com/-ygGIyb8t7P0/UExXwTFjgUI/AAAAAAAAAO0/oHSSckE4tpw/s1600/twitter.png'/></a>        

<a expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot;  + data:post.url' rel='external nofollow' target='_blank'><img border='0' src='http://2.bp.blogspot.com/-PfT1YSSroJY/UExXvZMMQQI/AAAAAAAAAOQ/bmyQitwObBU/s1600/digg.png'/></a>

<a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img border='0' src='http://4.bp.blogspot.com/-ofw_9GjmIAA/UExXu-ZhT9I/AAAAAAAAAOI/YvLdIYakHZs/s1600/delicious.png'/></a>

<a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img border='0' src='http://2.bp.blogspot.com/-oa5oDtmljaY/UExXvx5JH3I/AAAAAAAAAOk/2idhxCKLkP4/s1600/stumbleupon.png'/></a>

<a expr:href='&quot;http://www.technorati.com/faves?add=&quot; + data:post.url' rel='external nofollow' target='_blank'><img border='0' src='http://1.bp.blogspot.com/-HqPMcsCVvQs/UExXwFXCRsI/AAAAAAAAAOo/v0G5s2XlqHQ/s1600/technorati.png'/></a></p>

</center>

</b:if> 

Keterangan :
Bagi Yang Menggunakan Readmore Otomatis Ada 2 Kode <data:post.body/> , Maka Pilihlah Kode <data:post.body/> Di Template Sobat Yang Terakhir / Ke-2

• Simpan Template

Silahkan Cek / Buka Salah Satu Posting Sobat, Kalau Belum Muncul Coba Kodenya Ditaruh Di <data:post.body/> Yang Pertama / Terakhir
Share 'Widget Share Spinning' On ...

Widget Share Spinning 9 Out Of 10 Based On 10 Ratings. 9 User Reviews.