Best floating social bookmarking widget for blogger

 Now I'm going to Publish an Updated Version Of the Previous Floating Bar. The New Version of this Widget Is Fast loading, Minimal Look and has the Floating Feature like the previous version. This Widget contains Sharing Buttons Of Popular Social Networks like Twitter, Facebook, Google+, StumbleUpon and Pinterest. It's Also Integrated this widget with Add This Plugin So, now with the new version we can share our content to more than 300 Social Sharing sites. OK Lets see How to add this social bookmarking widget for blogger.Before that We can see the live demo of this widget.

Live Demo:-

How to add this Social Bookmarking widget on your blog?

It's Easy to Install this widget in your blogger blog. To add it just follow the simple steps given below.

• In Dashboard Go to Template > Edit HTML Button
• Ignore the Warning and Click the Proceed button
• Then Click Expand Widget Templates
• Search for <b:includable id='post' var='post'>
• Below that place the following code
  
  <b:if cond='data:blog.pageType == &quot;item&quot;'>
  <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
  <style type='text/css'>
  /*<![CDATA[*/
  #btnt-social { bottom: 10%; margin-left: -50px; position: fixed; }
  #btnt-social ul { list-style: none;clear: none;padding: 0px 0px ;margin: 5px 0;}
  #btnt-social ul li { display: inline;background:none;margin:0;padding:0;}
  #btnt-social ul li a { display:block; width: 32px; height:32px; margin: 5px 0; }
  #btnt-social ul li a.twitter { background: urlundefined"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidlaAaCei0CJXP82FSsGYFjD-GT1PsmflYzEWCDfx5yaDhEeSO4pAJii-rSUhhlmujdI1P8t_wGu8jCaixEzizvngc-_7lg4a0oKE6V_vbpd72jF0qldIiHY093sqdwK_QK80btDeVJLKj/s32/twitter.png") repeat scroll 0 0 transparent; }
  #btnt-social ul li a.facebook { background: urlundefined"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2K8yPDoNHaL4sMAGAWjVkAWXwbk3Cgh1yxScz0bPRSVs6mrXrkOjOoB3X0NAxJSOyiBrzMo-nkUcKRVWTRs_Q558GMa6as5SFaqxw9hylcnNvKeiOxccmif3uGLDsolOS8SXi7PAQjiPx/s32/facebook.png") repeat scroll 0 0 transparent; }
  #btnt-social ul li a.stumbleupon { background: urlundefined"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFfmycY6XvoxncPlhbEwv0Vmcj8JeWQgKs3ilpRB4rpaEnRTlublAgABHW6Tndti427qPeEwd4LoIusem1bKwSLy4keyvAlU0epduYiuVwjUIQG2tSyb53dMH0EJri5loZjBdQ0_PuDqXS/s32/stumbleupon.png") repeat scroll 0 0 transparent; }
  #btnt-social ul li .google-plus { background: urlundefined"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGcjnrKRnrJ8OD37SezSr_BSvmniKJu9a5xLewFokjDkgqZqQa07Q-S__2z-LUDyRkdECRHiwe4z-Gjq4a8Jo3DppZFRrIKMC9MW4q7hw1Wi-YvaiXaYq9u2FChzVn6JBlz9lrbPhFJqDU/s1600/g-plus.png") repeat scroll -1px 0 transparent; }
  #btnt-social ul li a.pin-it-button { background: urlundefined"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyetOAlTpuZR_X_P4wd2XP0-hz0cqA9pQu5z-WJrtGIVhBePcysXXC-59s8wId7gwwvxGDruqhpUjMSP6lz82k8Go8dkxcrpr9gcc9LtxMKcZDcos7cj-g-gAi332UM64BA0Y7wluHNjuu/s32/pinterest.png") repeat scroll 0 0 transparent; }
  #btnt-social ul li .addthis_32x32_style .dummy .at300bs, #btnt-social ul li .addthis_32x32_style .at300bs, #btnt-social ul li .addthis_32x32_style .at15t { background: urlundefined"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNptyHk9el1UcxhEqwyNWX6lFDkVxibw0_lpadYb_SMVN4Ic0q-ttRxL47DZDYiasMAUDxsmB1xn9CgsZg4UfQjHc7oXbZNUbKDZFWIkCYAo0bEQx6lIkw7bbzSnZJOlX7h2cTySJBi8z9/s32/sharethis.png") repeat scroll 0 0 transparent; }
  /*]]>*/
  </style>
  <div id='btnt-social'>
  <ul>
  <li><a class='twitter' expr:href='&quot;http://twitter.com/?status=&quot; + data:post.title + &quot; - &quot; + data:post.url ' rel='nofollow' target='_blank' title='Share this post on twitter'/></li>
  <li><a class='facebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share this post on Facebook'/></li>
  <li><a class='stumbleupon' expr:href='&quot; http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share this post on Stunbleupon'/></li>
  <li><a class='google-plus' expr:href='&quot; http://plus.google.com/share?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share this post on Google+ '/></li>
  <li><a class='pin-it-button' href='javascript:voidundefinedrun_pinmarkletundefined))'/>
  <script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/>
  <script type='text/javascript'>
  function run_pinmarkletundefined) {
  var e=document.createElementundefined&#39;script&#39;);
  e.setAttributeundefined&#39;type&#39;,&#39;text/javascript&#39;);
  e.setAttributeundefined&#39;charset&#39;,&#39;UTF-8&#39;);
  e.setAttributeundefined&#39;src&#39;,&#39;http://assets.pinterest.com/js/pinmarklet.js?r=&#39; + Math.randomundefined)*99999999);
  document.body.appendChildundefinede);
  }
  </script></li>
  <li><div class='addthis_toolbox addthis_32x32_style'>
  <a class='addthis_button_compact'/>
  </div>
  <script src='http://s7.addthis.com/js/300/addthis_widget.js' type='text/javascript'/></li>
  </ul>
  </div>
  </b:if></b:if>
• Now save your template And you can see your post page to check it.

Note:- This floating bar would display on post pages only and wont display on homepage.

If you want display on homepage, remove

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>

</b:if></b:if>

About The Author

This post is written by chandeep of blogtipsntricks.com