Floating Social Sharing Bar Widget For Blogger

This widget show a horizontal bar at side of your post, it have facebook like button
Google plus button, tweet button and add this button increase bueaty of your blog.

Screenshot of That widget

How To Install to blogger

Go To Dashboard »» Template »» Edit Html »» Press ctrl+f
and find code from Text box 1 and paste code From Text Box 2
Just below code of Text box 1 Code's.

Text Box 1

Text Box 2

<b:if cond='data:blog.pageType == "item"'> 
<b:if cond='data:blog.pageType != "static_page"'> 
<style> 
.kotlians_social_floating{ 
    position:fixed; bottom:01%; margin-left:-01x; float:left;     width:60px; 
    background-color:#f7f7f7;     padding: 5px 0 0px 0px; 
     border-top:1px solid #ddd; 
border-left:1px solid #ddd; 
border-bottom:1px solid #ddd; 
z-index:9999px !important; 
border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px; 
} 
.kotlians_social_floating .kotlians_side_social_button{ 
    margin-bottom:5px; 
    float:none; 
    height:auto; 
    width:60px; 
} 
.kotlians_social_floating .st_twitter_vcount, .kotlians_social_floating.st_plusone_vcount, .st_email{ 
    margin-left:5px; 
} 
.kotlians_social_floating .st_fblike_vcount{ 
    margin-left:5px; 
} 
.kotlians_social_floating .stButton_gradient{ 
    background:none !important; 
    height:21px !important; 
    padding-left:0 !important; 
} 
.kotlians_social_floating .chicklets, .kotlians_social_floating .stMainServices { 
    background:url('http://3.bp.blogspot.com/-8yL-31GvaU0/UUch0EgQreI/AAAAAAAAAVc/lYamLX32wVA/s1600/kotlians.blogspot.comgc_social_sprite.png') no-repeat !important; 
    height:19px !important; 
    width:45px !important; 
    padding:0 !important; 
} 
.st_email .chicklets{ 
    background-position:0 -77px !important; 
    background-image:url('http://3.bp.blogspot.com/-8yL-31GvaU0/UUch0EgQreI/AAAAAAAAAVc/lYamLX32wVA/s1600/kotlians.blogspot.comgc_social_sprite.png') !important; 
} 
.kotlians_social_floating .st_twitter_vcount .st-twitter-counter{ 
    background-position:0 -58px !important; 
} 
.kotlians_social_floating  .stButton_gradient{ 
    border:none !important; 
} 
.kotlians_social_floating .stBubble_count{ 
    width:44px !important; 
    font-size: 15px !important; 
    font-weight: normal !important; 
    padding-top:7px !important; 
    height:23px !important; 
    background:none !important; 
} 
.kotlians_social_floating .st_twitter_vcount .stBubble_count{ 
    color:#00a6df; 
    background-color:#f8fbfc !important; 
}

.st_fblike_vcount{ 
    margin-bottom: 0px; 
    display: block; 
} 
.st_twitter_vcount{ 
    margin-bottom: 3px; 
    display: block; 
}

.st_email{ 
    margin-bottom: 5px; margin-top: 3px; 
    display: block; 
} 
.kotlians_social_floating .stBubble{ 
    background-position: 21px 31px !important; 
    height:35px !important; 
}.kotlians_social_floating .st_pinterest_vcount{
    margin-left:5px;
}
.kotlians_social_floating .st_pinterest_vcount .st-pinterest-counter{
    background-position:0 -19px !important;
}
.kotlians_social_floating .st_pinterest_vcount .stBubble_count{
    color:#FF0505;
    background-color:#fbf8f8 !important; 
}

.kotlians_social_floating .st_pinterest_vcount .stBubble{
    background-image:url('http://4.bp.blogspot.com/-IQURk2PYW7w/UUchz8iF7sI/AAAAAAAAAVY/WPR6V2bh7bE/s1600/kotlians.blogspot.com-bubble_arrow_pinterest.pn') !important;
}

.st_pinterest_vcount{
    margin-bottom: 0px;
    display: block;
}

</style>

<div class='kotlians_social_floating'>
 
    <script type='text/javascript'>var switchTo5x=true;</script> 
    <script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/> 
    <script type='text/javascript'>stLight.options({onhover:false, , doNotHash: true, doNotCopy: true, hashAddressBar: false});</script> 
     
<div style='margin:0px 0 0px 10px;'>
<div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:like font='' href='' layout='box_count' send='false' show_faces='false'/></div>
<span class='st_twitter_vcount' displaytext='' st_via='baadshah26gold'/> 
<span class='st_pinterest_vcount' displaytext=''/>
<div style='margin:0px 0 0 5px;'>
 
    <span class='st_plusone_vcount' displaytext=''/> 
</div>
<div class='addthis_toolbox addthis_default_style ' style='margin:5px 0px 5px 8px;'>
 
<a class='addthis_counter'/> 
</div>
<script src='http://s7.addthis.com/js/250/addthis_widget.js' type='text/javascript'/> 
<script type='text/javascript'> 
var addthis_config = { 
     ui_cobrand: "MY BLOGGER TRICKS", 
ui_header_color: "#ffffff", 
     ui_header_background: "#0080FF" 
} 
</script> 
<span class='st_email' displaytext=''/> 
<p style=' line-height:0px; font-size:10px; font-weight:bold; text-align:center;'>
<a href='http://baadshah26gold.com/floating-social-sharing-bar-widget-for-blogger/' style='color:#CAC8C8;'>Widgets</a></p>
</div>
</b:if></b:if>

In Text box Code there is a twitter user name baadshah26gold

You must have to Rename it with your user name

And enjoy..!!!!!

Facebook SDK

Floating Social Sharing Bar Widget For Blogger

Floating Social Sharing Bar Widget For Blogger

How To Install to blogger

Post a Comment

إرسال تعليق

نموذج الاتصال