How to Add Floating Social Widget For Websites , Blogger , Wordpress

Blogger Users	Wordpress Users
Go to Layout Add a widget Select HTML/JavaScript Copy paste the code given below	Go to  Appearance > Widgets  Select text widget and Drag it into sidebar. Copy paste the code given below. Click save.

<style type="text/css">
.sb{
background:#f0f0f0;
cursor:pointer;
color:#fff;
padding:4px;
text-shadow:0 -1px 1px rgba(0,0,0,0.25);
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px; margin-left:8px;
font:12px sans-serif;
}
.sb:hover{
background:#777;
}
.tl {text-align:center;font-size:10px;font-weight:bold }
#Ps {position:fixed; bottom:15%; margin-left:-100px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:#fff;border: 1px solid #f7f7f7; padding:0 0 2px 0;z-index:10;}
#Ps .sb {float:left;clear:both;margin:5px 2px 0 5px;}
#Ps:hover {-moz-border-radius:6px;
    -moz-box-shadow: 0 2px 4px hsla(0,0%,0%,.35);
    -webkit-box-shadow: 0 2px 4px hsla(0,0%,0%,.35);border: 1px solid #ddd;}
</style>
<div id='Ps'>
<div class='sb' id='fblb'>
<a class="addthis_button_facebook_like" fb:like:layout="box_count"></a>
</div>
<div class='sb' id='su'>
<script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script>
</div>
<div class='sb' id='gpo'>
<a class="addthis_button_google_plusone" g:plusone:size="tall"></a>
</div>
<div class='sb' id='Tw'>
<a class="addthis_button_tweet" tw:count="vertical"></a></div>
<div class='sb' >
<a class="addthis_counter"></a>
</div>
<div class="tl">
<a href="http://www.trickolla.com" target="_blank" >Get This</a>
</div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script>
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=xa-50bf6c151159d2c0"></script>
</div>

Posted in: Blogger, Wordpress