Animated Sassy Social Bookmark Gadget

I know there have been many ReBlog posts lately but all of them are worth the share, they are very inspiring and that's what I look for in this blog and here's another How-to-do with tips for social media shares on blogs.

I know how much you all like social bookmarking gadgets and widgets especially unique gadgets that can catch the eye of readers and get them bookmarking your blog. Today I have a very cool social bookmarking gadget with a stylish animated effect. With the Sassy bookmarks gadget a basic share button is placed in the corner of your blog, then on hover 6 icons for the main social bookmarking websites appear in a semicircle. The buttons that appear are for Pinterest, Google+, Facebook, Twitter, Tumblr and Email. Below we have a live demo then check out the tutorial to add the Sassy Bookmarks to Blogger.

Add The Animated Sassy Bookmarking Gadget To Your Blog
Remember Always Back Up Your Template Before You Make Changes

Step 1. In Your Blogger Dashboard Click The Drop Down Menu For Your Blog > Choose Template > Then Edit Html > Tick The Expand Widget Templates Box as shown in the video Below :

Step 2. Find the following piece of code in your blogs Html :
(Click Ctrl and F for a search bar to help find the code)

</body>

Step 3. Copy and Paste the following code Directly Above / Before </body>

<!-- Start Shareaholic Sassy Bookmarks HTML - http://www.spiceupyourblog.com -->
<div class='shr_ss shr_publisher'>

</div>
<!-- End Shareaholic Sassy Bookmarks HTML -->
<!-- Start Shareaholic Sassy Bookmarks settings -->
<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><small><a href='http://www.spiceupyourblog.com/2012/05/animated-sassy-social-bookmark-gadget.html'>Animated Social Gadget</a> - <a href='http://www.spiceupyourblog.com'>Blogger And Wordpress Tips</a></small>

<!-- End Shareaholic Sassy Bookmarks script -->
<!-- End Shareaholic Sassy Bookmarks HTML - http://www.spiceupyourblog.com -->

Step 4. Save Your Template.

That's it the animated Sassy Bookmarks gadget is on your blog !
Drop Your Comments And Questions Below.

Source: [Link].