Sep 11, 2011

How to Add Floating Facebook Share,Tweet, +1 Button in Blogger?

I have ever posted about how to put social bookmark sharer button, that's sharing is sexy button. I also have posted about how to put our social media icon to help your reader close and know more about you. A hour ago, I was looking for simple sharer button, I only need Facebook sharer, Tweet button, and the new one +1 button from Google. Fortunately, I find a easy tutorial about how to add floating social bookmark button next to post in Blogger from MyBloggerTricks. Really thanks to you, the author.

You can see this sticky widget to left of my blog, both on homepage and postpage. The installation process is so easy. Here I share how to add floating Facebook Share,Tweet, +1 Button in Blogger.

  1. Go To Blogger > Design
  2. Choose a HTML/JavaScript widget
  3. Paste the following code inside it
  4. <style>
    /*-------MBT Floating Sharing Widget------------*/

    #floatdiv {


    #mbtsidebar {
            border-top:1px solid #ddd;
            border-left:1px solid #ddd;
            border-bottom:1px solid #ddd;
            margin:0 0 0 5px;

    .fb_share_count_top {width:52px !important;}

    .fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}

    .FBConnectButton_Small, .FBConnectButton_RTL_Small {width:52px !important; -moz-border-radius:3px;/*bs-fsmsb*/-webkit-border-radius:3px;}

    .FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}


    <div id="floatdiv">
    <div id="mbtsidebar">
        <table cellpadding="1px" cellspacing="0">

        <td style="padding:5px 0px 0px 0;">
    <a href="" class="twitter-share-button" data-count="vertical" data-via="mybloggertricks">Tweet</a><script type="text/javascript" src=""></script>

        <td style="padding:5px 0 2px 0;">
        <a name="fb_share" type="box_count" href="">Share</a><script src="" type="text/javascript"></script>
        <td style=" padding:5px 0px 0px 0px;">

    <script src='' type='text/javascript'> {lang: &#39;en-US&#39;} </script>

    <g:plusone size="Tall" expr:href="data:post.url">
    <p style=" line-height:0px; font-size:10px; font-weight:bold; text-align:center;"><a style="color:#D3D3D3;" href="">Widgets</a></p>


  5. Save your widget and drag it just below the post body as shown below
  6. Finally click the save button at the top right corner and done

Any question or complete customization, you can go to author website.


  1. Hi, why my posting become like the one in this picture?

  2. Here is the picture...check the link..thanks..

  3. I was searching since long and I got finally, thanks a lot for sharing.

  4. really nice.Looks cool
    I have been searching it for long time.Thanks

  5. nice info...
    i'd tried but where and how to put my facebook link in this HTML?


  6. Wow, Great post,Nice work, I would like to read your blog every day Thanks.

  7. Thereby, pandora bracelet australia even if deciding on a part of pandora australia related to pandora bracelets sale, youll be able to find the coloring plus somewhat every single one bead in accordance with unique loving. In the future, your lover contributed pandora bracelet beads a young adult, acquired a sign of adore, so that you can augment his pandora bracelet bride, memorial trinkets coming from a higher education holiday, a premium pandora beadsof Falcon. Got to the food so long as the eyes pandora charms and employ your current innovation and make your pandora jewelry current fashio

  8. it is impressively easy to add a widget with those options that blogger has. Even for those that you have to add a code on it and thanks for the tutorial.

  9. Coach outlet online Leading American designer and maker of luxury lifestyle handbags and accessories.Large market in Europe and Canada,UK,USA etc.Welcome to Order!2011 New Style arrive,Free Shipping!

  10. for the other reason, this one of i looking for.. nice posting.. ban terbaik di Indonesia gt radial

  11. “Luxury, fashion and art are both expressions of emotion and passion; they search the

    exceptional and give us an alternative view of the world. Art inspires fashion and luxury,

    as luxury and fashion inspires art, Coach Factory Outlet."

  12. So cute & thanks!!U make my blog much cooler and beautiful!! hope there's more!!

  13. in the Coach Outlet role of impotent bystander,among the 17 countries that use the euro,matter what happens at the European summit meeting on.

  14. In the post has been define the about face book and how to add floating so that can be able to understand and know that regarding post.

  15. Its really a nice article. It has good content. Thanks for sharing it.

  16. I really loved reading your blog. It was very well authored and easy to understand. Unlike additional blogs I have read which are really not good. I also found your posts very interesting. In fact after reading, I had to go show it to my friend and he enjoyed it as well!

  17. Those people are very like it and enjoy it in this post.It is useful so that can be used in this technology.

  18. Thanks a lot for the Post!! I Already added it!!


Hi, thanks for visiting. You can leave your comment here


Related Websites


Ipietoon-Cute Blog Design Blogging Since 2008