Add Animated Social Sharing Widget With Cool Hover Effects

Your visitors show any post then he likes to share this content. Now I provide you how to add animated social sharing widget with cool hover effects bellow the blog page left corner. This widget is for sharing posts with Friends. If peoples Share with Friends you blog traffic more. This widget is making your blog more satisfied. So follow this and enjoy.

Social Media Icons Animated Hover Effect:

• Login to your Blogger Dashboard click here
• Select your blog and click on right side bar
• Select "Template" on drop down menu

• Now create a backup of your blogger template because if you have any wrong this template after edited, you can restore this. So click on Backup /Restore and download Full Template.

Add Animated Social Media Icons or Widget:

• Click on "Edit HTML" button

• Click anywhere inside the code area and press the CTRL + F keys on your keyboard to open the Blogger' search box. 

 A. Write Search box then hit enter your keyboard and find this tag

</body>

 B. Past the bellow code before this tag

HTML Code For Social Media Icons:

<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>

<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>

 C. Now click on Save template button.

• That's all.

-----------------------------------------------------

If you have any question and suggestions related blogger

Please don't hesitates just sent email or leave comment

Thanks to follow this tutorial

Best regards

help2blogging team