Add beautiful floating social media buttons to blogger drive traffic

Summary: By this useful article you teach that how you add beautiful floating social media buttons in blogger, You can drive traffic from Social media buttons and also your blog looking like professional style. 




By this useful article you teach that how you add social media buttons in blogger blog and drive traffic easily. Really this article is very useful for new blog owners they want to improve traffic to blogger blog. I have seen, that lot of bloggers are using floating social media sharing buttons in blogger in order to obtain more allocation of contents and
drive traffic. One important thing note that Social Media buttons also drive traffic but looking more beautiful on blogger blog and also attractive to your visitors and readers. Now this is very simple I guide you step by step through one useful HTML code, no problem if you did hot have any knowledge of HTML, you can do without any knowledge of HTML you can add floating social media buttons to Blogger blog.

Social Media buttons are very stylish and more useful and attractive when you add your blogger side bar and see floating of Social bookmark buttons accordingly. How social bookmark buttons look like on your blogger template see the picture has given below:


 


 











Now go to www.blogger.com then Layout, Page Element and click on Add a gadget and select HTML/Java Script and add the code given below and then press click save button.

<!-- floating page sharers Start teachblogspot.blogspot.com-->
<style>
#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="Get this from ehowportal.blogspot.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 class="DiggThisButton DiggMedium"></a>
</div>
<div class='sbutton' id='gb'>
<a class='google-buzz-button' data-button-style='normal-count' href='http://www.google.com/buzz/post' title='post on google buzz'>
<script src='http://www.google.com/buzz/api/button.js' type='text/javascript'></script>
</a></div>
<div class='sbutton' id='gplusone'>
<script type="text/javascript" 
src="http://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone>
</a></div>
<div style="clear: both;font-size: 9px;text-align:center;"><a href="http://ehowportal.blogspot.com/2011/05/how-to-add-floating-social-media.html">Get this</a></div>
</div>
<!-- floating page sharers teachblogspot.blogspot.com -->

I hope this tip of floating of social media buttons to blogger and drive traffic  will be very useful for you, if you like it please leave your comments.

you may like my topic on

MuftPakistan.com Sign up for FREEUpdates.