Floating Social Media Sharing Buttons

As you all know that only advertising and getting good ranks is not sufficient for your blogs progress. You should also have good visitors as well as pageviews. You should also allow readers to share your posts into different social networks like Facebook, yahoo, twitter, Google plus, etc. Here in this post I will show you how to add floating share buttons to your blog. This is also a popular concept of increasing your traffic.

Actually your readers might have difficulties in sharing your posts. So if floating share buttons are added then they might feel easy. Moreover floating share buttons helps to make your visitors flexible and somehow makes your blog attractive towards your blog which will ultimately increase your blog's traffic.

Now lets begin:

Go to Design > Page Elements.

Click Add A Gadget.

In Add A Gadget window, choose HTML/JavaScript.

Copy the code given below and paste it inside the blank box.

Save the gadget.

Drag the gadget and reposition it under Blog Posts gadget.

Save gadget (top right click hand corner).

<!-- floating share bar Start bloggingsentral.blogspot.com-->
<style type="text/css">
#pageshare {position:fixed; bottom:15%; margin-left:-71px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;padding:0 0 2px 0;z-index:10;}
#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !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;}
</style>
<div id='pageshare' title="Share It">
<div class='sbutton' id='fb'>
<a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
</div>
<div class='sbutton' id='rt'>
<script src="http://tweetmeme.com/i/scripts/button.js" type='text/javascript'></script>
</div>
<div class='sbutton' id='su'>
<script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script>
</div>
<div class='sbutton' id='digg' style='margin-left:3px;width:48px'>
<script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script>
<a class="DiggThisButton DiggMedium"></a>
</div>
<div class='sbutton' id='gplusone'>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<g:plusone size="tall"></g:plusone>
</div>
<div style="clear: both;font-size: 9px;text-align:center;"><a href="http://bloggingsentral.blogspot.com/2012/05/floating-social-media-sharing-buttons.html">Get This</a></div><!-- Do not remove this link -->
</div>
<!-- floating share bar End -->

After adding the above code in your site a floating bar containing sharing buttons will be seen which will provide the reader easy way to share it worldwide.
Enjoy your new widget and keep on reading Blogging Sentral the blog of your choice.