Add an Animated Social Sharing Widget with Hover on Blogger

One of the uber-cool features that you can add to your Blogger blog is the animated social sharing widget or what is known as SassyBookmarks. Sidharth Patnaik teaches a simple way on how you can integrate it in your Blogger.

1. Go to your Blogger Dashboard > Template
2. Backup your template first before anything else
3. Find this code </body> in your template
4. Add code below above or before of above </body>

<!-- Start Social Sharing Widget Sassy Bookmarks HTML (allbloggingtips.com)--

>

<div>

</div>

<!-- End Shareaholic Sassy Bookmarks HTML -->

<!-- Start Shareaholic Sassy Bookmarks settings -->

<script type="text/javascript">

var SHRSS_Settings = {"shr_ss":

{"src":"//dtym7iokkjlif.cloudfront.net/media/downloads/sassybookmark","link":"","service":"5,7,2,313,38,201,88,74","apikey":"

b87f5899d80a5edce8b5e55f58542ef0f","localize":true,"shortener":"bitly","shortener_key":"","designer_toolTips":true,"tip_bg_co

lor":"black","tip_text_color":"white","viewport":true,"twitter_template":"${title} - ${short_link} via 

@Shareaholic"}};

</script>

<!-- End Shareaholic Sassy Bookmarks settings -->

<!-- Start Shareaholic Sassy Bookmarks script -->

<script type="text/javascript">

(function() {

var sb = document.createElement("script"); sb.type = "text/javascript";sb.async = 

true;

sb.src = ("https:" == document.location.protocol ? "https://dtym7iokkjlif.cloudfront.net" 

: "http://cdn.shareaholic.com") + "/media/js/jquery.shareaholic-publishers-ss.min.js";

var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(sb, 

s);

})();

</script>

<!-- End Shareaholic Sassy Bookmarks script -->

Check out this cool live DEMO.