Social media plays a significant role if you want to increase your website traffic. One way to do this is giving your readers a way to share your content or post easily.
Haven't you notice the floating social bookmark buttons on this blog? A lot of bloggers already have them and now I want to share them to you so you could also use these cool social bookmarking buttons.

In Wordpress you can add floating share buttons easily by using plugins. But, how about for blogger? You just need to add a widget and follow these simple steps to have your own floating share buttons on your blog's sidebar.

1. Log in to your blogger account and Go to Design >> Page Element

2. Click Add Gadget and select 'HTML/Javascript'

3. Copy and Paste the code below.

<style> #sharebar {position:fixed; bottom:15%; margin-left:-71px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#ffffff;padding:0 0 2px 0;z-index:10;right:0;} #sharebar .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;-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><br /> 
<div id="sharebar">
<div class="sbutton"><br /> </div>
<div class="sbutton" id="google+1"><g:plusone size="tall"></g:plusone><script src="https://apis.google.com/js/plusone.js" type="text/javascript"></script></div>
<div class="sbutton" id="facebook"><fb:like layout="box_count" show_faces="false" font=""></fb:like><script src="http://connect.facebook.net/en_US/all.js#xfbml=1" type="text/javascript"></script></div>
<div class="sbutton" id="twitter"><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script></div>
<div class="sbutton" id="digg"><script src="http://widgets.digg.com/buttons.js" type="text/javascript"> </script><a class="DiggThisButton DiggMedium" href=""></a><br /> </div>
<div class="sbutton" id="rt"><script src="http://tweetmeme.com/i/scripts/button.js" type="text/javascript"> </script><br /> </div>
<div class="sbutton" id="su"><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"> </script></div><div style="clear: both;font-size: 9px;text-align:center;"><a href="http://www.marjerizz.com/2011/10/floating-social-buttons-and-how-to-add.html">Get widget</a></div><!-- Do not remove this link -->
</div></div>

4. Save HTML/Javascript. you are done.

Subscribe to Get the latest Update Via Email

Enter your email address:

Related Posts by Categories