Sassy Social Bookmarking Widget dengan Animasi Untuk Blogger

Selamat pagi sobat blogger, terimakasih sudah bersedia berkunjung kembali di Juru Coding. Sebelumnya mohon maaf karena updatenya jarang-jarang, maklum masih konsen uts.

Pada kesempatan ini saya akan berbagi widget social bookmarking dengan animasi, dimana widget ini akan berada disudut kiri bawah, sedikit jauh mirip dengan yang berada di sudut kiri bawah yang ada pada Path.

Stylenya sederhana dan tidak berpengaruh pada loading blog karena widget ini memang ringan dan tentunya tidak ketinggalan jaman. berikut screenshotnya.

Demo bisa dilihat di demo-jurucoding.blogspot.com

Berikut cara membuatnya :

1. Login akun blogger
2. Masuk ke Template > Edit HTML
3. Kemudian letakkan script dibawah ini tepat sebelum tag </body>

<div class='shr_ss shr_publisher'>
</div>
<script type='text/javascript'>
var SHRSS_Settings = {&quot;shr_ss&quot;:{&quot;src&quot;:&quot;//dtym7iokkjlif.cloudfront.net/media/downloads/sassybookmark&quot;,&quot;link&quot;:&quot;&quot;,&quot;service&quot;:&quot;5,7,2,313,38,201,88,74&quot;,&quot;apikey&quot;:&quot;b87f5899d80a5edce8b5e55f58542ef0f&quot;,&quot;localize&quot;:true,&quot;shortener&quot;:&quot;bitly&quot;,&quot;shortener_key&quot;:&quot;&quot;,&quot;designer_toolTips&quot;:true,&quot;tip_bg_color&quot;:&quot;black&quot;,&quot;tip_text_color&quot;:&quot;white&quot;,&quot;viewport&quot;:true,&quot;twitter_template&quot;:&quot;${title} - ${short_link} via @Shareaholic&quot;}};
</script>
<!-- End Shareaholic Sassy Bookmarks settings -->
<!-- Start Shareaholic Sassy Bookmarks script -->
<script type='text/javascript'>
(function() {
var sb = document.createElement(&quot;script&quot;); sb.type = &quot;text/javascript&quot;;sb.async = true;
sb.src = (&quot;https:&quot; == document.location.protocol ? &quot;https://dtym7iokkjlif.cloudfront.net&quot; : &quot;http://cdn.shareaholic.com&quot;) + &quot;/media/js/jquery.shareaholic-publishers-ss.min.js&quot;;
var s = document.getElementsByTagName(&quot;script&quot;)[0]; s.parentNode.insertBefore(sb, s);
})();
</script>

Setelah itu simpan template dan lihat hasilnya.

Jika terjadi error, atau terdapat kesulitan silahkan berkomentar dibawah dan jelas kendalanya atau bisa langsung hubungi saya melalui kontak yang tertera pada sidebar.