Thursday, March 29, 2012

Add Social Media Buttons to Blogger

Social Media Sharing website are allows person to getting plenty of visitors from, Think you are Facebook person and you have so many buddies relevant to your company.  

How to add floating social media sharing buttons to blogger blog? It is the most recent pattern to get reveals your content all over the community. Doing this you can easily increase your visitors to weblog. 
Social Media Buttons to Blogger

Did you observe on most of weblogs using Floating Social Buttons in eventually left part or in right part of the page? Here is a guide on how to add a floating bar of social media control buttons to a Blog writer weblog. Here provided Facebook Share, Stumble, Stumble, Twitter, Digg this and Google +1 (plus one) control buttons in the bar. Each of them comes with stay surfaces.

How to Add Social Media Buttons in your blog.

Here are some of steps by step process to add floating social media buttons on your blogger.

Step-1. Login to your blogger dashboard account.
Step-2. Select Layout tab and select add gadget, here click on HTML/Javascript button, so one window will opened.
Step-3. Copy below provided code and pastes it in the opened window then save.
 

<!--SideBar Floating Share Buttons Code Start-->
<style>
#pageshare {position:fixed; bottom:10%; right:10px; float:right; border: 1px solid black; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#eff3fa;padding:0 0 2px
0;z-index:10;}
#pageshare .impbutton {float:right;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 id='pageshare' title="Share This With Your Friends">
<div class='impbutton' id='ww'><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class='impbutton' id='yy'><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='impbutton' id='googlep'><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div>
<div class='impbutton' id='xx'><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></div>
<div class='impbutton' id='dd' 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='impbutton' id='ll'><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><br/><div style="clear: both;font-size: 9px;text-align:center;"><a href="http://net-makemoneyonline.blogspot.com/2012/03/social-media-share-buttons.html" target="blank"><font color="black">[Get This]<font></font></font></a></div><div style="clear: both;font-size: 7px;text-align:center;">by<br/><a href="http://net-makemoneyonline.blogspot.com" target="blank"><font color="black">make money<font></font></font></a>
</div></div>
<!--SideBar Floating Share Buttons Code End-->