How To Add Social Bookmarking Widget With Tooltips For Blogger

Ethnic bookmarking widget is need of every blogger thats why you see much gadgets virtually on every journal.Friendly bookmarking widgets helps you to assist interchange on your diary.Today I am distribution an awful interpersonal bookmarking widget which comes with ravishing spirited tooltips,when any mortal hovers on the gregarious icons the tooltip comes out also it applies a quality event to these ethnic icons,this gist increment exemplar of this widget.Achievement for this widget goes to Shareaholic.Now lets see hoe to add it to your journal, see the demo picture below.

How To Add This Widget To Blogger

Now go to Page Layout

Click on Add a Gadget

Select HTML/JavaScript

Leave title field blank

Paste below code and save it

Drag the widget to bottom of your page.

Finally save your changes

<b:if cond='data:blog.pageType == "item"'> 
<!-- Social Bookmarking Widget With Animated Tooltips By http://www.bloggers-hero.blogspot.com/ -->
<script type="text/javascript">
  var SHRCB_Settings = {"shr_classic":{"size":"32","link":"","service":"5,7,313,309,78,304,88","apikey":"2fc518bd8c0bb3cf45bdade11877971c1","shortener":"bitly","shortener_key":"","designer_toolTips":true,"twitter_template":"${title} - ${short_link} via @Shareaholic"}};
  var SHRCB_Globals = {"perfoption":"1"};
  </script>
 <!-- End Shareaholic Classic Bookmarks settings -->

        <!-- Start Shareaholic Classic 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-cb.min.js";
            var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(sb, s);
        })();
        </script>

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

        <script type='text/javascript'>
          if (typeof(SHR4P)=="undefined") SHR4P = {};
          SHR4P.blogger_addDiv = SHR4P.blogger_addDiv || function(divClass)
          {
                  var post = new RegExp('hentry');
                  var titleContainer = new RegExp('post-title');
                  var postContainer = new RegExp('post-footer');
                  var elements = document.getElementsByTagName('div');
                  for (var i = 0; i < elements.length; i++) 
                  {
                      var classes = elements[i].className;
                      if (post.test(classes)) 
                      {
                          var container = elements[i];
                          for (var j = 0; j < container.childNodes.length; j++)
                          {
                              var item = container.childNodes[j].className;
                              if (titleContainer.test(item))
                              {
                                  var link = container.childNodes[j].getElementsByTagName('a');
                                  if (typeof(link[0]) != "undefined")
                                  {
                                      var url = link[0].href;
                                      var title = link[0].innerHTML;
                                  }
                                  else
                                  {
                                      var url = document.url;
                                      var title =  container.childNodes[j].innerHTML;
                                  }
                                  if (typeof(url) == "undefined"|| url == 'undefined' ){
                                      url = window.location.href;
                                  }
                                  title=title.replace('"',"%22");
                              }
          
                              if (postContainer.test(item))
                              {
                                  var footer = container.childNodes[j];
                              }
                          }
                          var d = document.createElement('div');
                          var code = '<div style="clear:both"></div><div class="' + divClass + ' shareaholic-show-on-load" data-shr_href="' + encodeURI(url) + '" data-shr_title="' + title + '"></div><div style="clear:both"></div>';
  
                          d.innerHTML = code;
                          container.insertBefore(d , footer);
                    }
                }
                return true;
        };
        SHR4P.blogger_addDiv("shr_classic");</script>
</b:if>

Note- This widget will happen on stake pages only,if you need to show this widget at the nethermost of every communicating on your homepage then take best wares (<b:if cond='data:blog.pageType == "item"'>) and last line(</b:if> from the code.