Add social bookmarking buttons to your blogspot

Social website makes a big role in your blog. The most affecting social medias are Google +, Facebook, Twitter, Digg, Stumble, Reddit, Delicious. You can use these websites to promote your traffic and rank by adding its button to your website. In this post, I will give you all the steps to add these social bookmarking button to your blog spot.

1. First, open your blog dashboards and click on Layout on the leftside bar.
2. Then, click on Add a Gadget.
3. Next, choose HTML/JavaScript and click plus button.
4. After that, copy below Code inside that Gadget.

<!-- floating page sharers Start Webtricksblog.com-->
<style type="text/css">
#floatingshare {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;}
#floatingshare .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='floatingshare' title="Get this from Webtricksblog.com">
<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></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;">Get <a href="http://www.webtricksblog.com/floating-social-media-buttons-blogger.html">widget</a></div><!-- Do not remove this link -->
</div>
<!-- floating page sharers End -->

5.  Finally, click on Save and view blog. These buttons appear as displayed as the following figure

Hope this helps!

Posted in: blog tips, bloger, Blogging, SEO, social bookmarking button