Cara Membuat Widget Share Social Media Berputar di Bawah Postingan

Di postingan saya kali ini saya akan menjelaskan tentang bagaimana caranya membuat widget sosial bookmark berputar. Dengan memasang widget ini tentunya akan menambah trafik pengunjung blog kamu loh, karena para pembaca yang membaca postingan kamu dan tertarik untuk membagikannya di media sosial seperti facebook ataupun twitter. Sehingga pengunjung lainnya pun datang deh. Oke langsung saja lihat caranya di bawah ini :
1. Login ke Blogger.com
2. Klik Template
3. Masih di bagian Template, Klik Edit HTML --> Klik lagi Lanjutkan --> Centang "Expand Widget Template".
4. Cari kode   <div class='post-footer-line post-footer-line-1'/>, gunakan CTRL + F untuk memudahkan pencarian.
5. Salin kode CSS di bawah ini dan letakkan diatas kode <div class='post-footer-line post-footer-line-1'/>.

<b:if cond='data:blog.pageType == "item"'>
<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(70deg);    -webkit-transform: rotate(70deg);    -o-transform: rotate(70deg);    -ms-transform: rotate(70deg);    transform: rotate(70deg);}
</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=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv6Dp4vcA0X5c5PVcxJ22u7xkFWBKOqm3Fw-6ax0UtfKdPlICmDkJRyqh50tP2K_4GnJFRu4BIzo6dT-iFGSpRCGYS4-6md1tjoX_sJcOmRB1O8lPEpKZ_WH0n-lpod97ggBsYkFgJgP0/s1600/hzndi.blogspot.com-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='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEildxs7JBt83d8CeOR1MGM5n4fPMhlqgQOIYPjBWRjIOgEoy-rDqabHjBgS5O-1igkPH2inTUJJMuRda3hE7To0YkTdCsuS9zcz4a5tcsE7xUtpl2q1EABg6SKYFXTHDLoSrQJWi6ESG0s/s1600/hzndi.blogspot.com-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='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTM-6B8qIkVoe1EHzQZ-uxK4aa7S_nSlS8HhdBWbJp3urWyYVq4JSe3vn6d8uFhsZ9WkcXFYoTM52_tIzuQXWAdQGRUxEunYgfQj8P4rc3k5L5puZqCi42jejcZYyuMTLjRd8pEUyIZf4/s1600/hzndi.blogspot.com-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='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbmflhIKeXiq0n6uQiBYTnkgH-LXNPf6UD93A0x4NWr_KkO4pblcFI1cTId7j7zMC02-b0RoK1f6PFQRpLTA1XKeiqM7YBgwpcoxR8hvG86FILGRwwXeUaSp6I44uC65XIEdMQ8QRLOZOC/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='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtFTi07yPHAYsNOej70dAD7wTjP8gDe5ziwQIh5QnzUAwwhGac9MBptA_j-WyGzTLYD0LMfGcGizIR_f75ThOVhxq-imAFql7diuHkOlTm01M-9S_-lyvwNmOdhMb4GIxZKVsJSzyOY2g-/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='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKpiT_GcD6xcKxPnjI_gWjLiK-BOIG8ScTBY61IX-SgBhwzGrCWTI-RYlQVxEWLqTWbUREXN_SuroXSHraJIVOD0JA2AMUpNbZybnaQXrLv7xYEaF_x3xISfYguRoWi9xeU8qh8fPkoDzE/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='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwEwwzBB25ctV9t3lKUXYsOL8zr6KmK-gCf6L05WJeRYc0tOQs-wLcpiSfBUoZBoOsyLTIImtiMa3nS5-4LDVb3Dp8AQPxFQ__3XWbyHIqLb0856eT3UkfbeKiP9pIJLOcUfjjvgHMX_n0/s1600/technorati.png'/></a></p></center><p style='display:none;'>Spinning icons by <a href='http://www.hzndi.blogspot.com'>Tutorial Blog dan SEO</a></p></b:if> 

6. Simpan Template

Comments