Add Floating Facebook Like and Retweet Widget To Blogger/Blogspot

Facebook Like Button and retweet counter by tweetmeme are the two most widely used social media widgets without which you can’t call a blog a blog. Both these buttons along with Stumble Upon bookmarking button can let your readers circulate/share your tutorials and articles with their interested collegues and friends connected to them via these social networks. With a little HTML spiced with CSS we succeeded in creating a floating widget that will include these three buttons and will stay fixed at the middle lift side of your websites. The widget settings can surely be changed to align it to the right, bottom or left if you wish. You can also add more buttons to it if you wish like DIGG for instance. See a demo first.





Installation - 

1. Go To Blogger > Design
2. Select HTML/JavaScript Widget from anywhere (Position doesn’t matter)
3. Inside it paste the code below.
4. Don't give any name to widget.

 <div style="display:scroll; position:fixed; top:40%; left:2%; border: 1px dotted #E8E8E8; padding:0px 0px 0px  5px; height:220px; width:53px "> 
    <table cellpadding="1px" cellspacing="0"> 
    <tr> 
    <td style="border-bottom: 1px solid #E8E8E8; padding:5px 0 2px 0;">  
    <div id='fb-root'/><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:like font='' href='' layout='box_count' send='false' show_faces='false'/> 
    </td> 
    </tr>
    <tr> 
    <td style="border-bottom: 1px solid #E8E8E8; padding:5px 0px;"> 
    <script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script> 
    </td> 
    </tr>
    <tr> 
    <td style="border-bottom: 0px solid #E8E8E8; padding:5px 0 0px 0;">
<a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="rahulippar">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script> 
    </td> 
    </tr>
    </table> 
    </div>

4. Simply replace rahulippar with your twitter username.

5. Save your widget and you are Done!


If you added it to your blog paste your blog address in comments.