Contact Us:

If You Have Any Problem, Wanna Help, Wanna Write Guest Post, Find Any Error Or Want To Give Us Feedback, Just Feel Free To Contact Us. We Will Reply You Soon.

Name: *


Email: *

Message: *


Skillblogger

Download our app on Google Play Store

Monday, April 8, 2013

Add a Stylish Floating Bar to Increase Number Of Subscriptions For Blogspot

Add Stylish Floating Bar for bloggerHi guys, hope all is good with you. Well, this issue will be about how to create floating bar for social networks sharing buttons, it a nicer way for your readers to keep in touch with your blogs and for me to share stuff with you.
As we all know that contributions increase the popularity of blogging, for this was creating a vertical bar featuring social networking buttons, neatly fits with the shape of the post, reflected the work of this vertical bar in the property that would enable it to accompany the visitor up and down while browsing. In addition to this, the bar can be located along entry left or right, depending on your choice.
before starting to explain how to add the widget to your blog, I would like to thank my brother Muhammad from STC Network for his explanation of the addition on his wonderful blog.

How to add it ?

I would give you an easy way to add it faster to your blog without any problem :)


This how it will appears :


Stylish Floating Bar for blogger
  • Link to Blogger.com >> Design
  • Please don't forget to Backup your template for preventing any problem.
  • Press Edit HTML
  • And then click ;)
  • Now attention please and use Ctrl+F to Find the code bellow:
<b:includable id='post' var='post'>
Copy and paste below code just Below/After the code  <b:includable id='post' var='post'>


<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<style>
.mbt_social_floating{
    position:fixed; bottom:10%; margin-left:-60px; 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;
}
.mbt_social_floating .mbt_side_social_button{
    margin-bottom:5px;
    float:none;
    height:auto;
    width:60px;
}
.mbt_social_floating .st_twitter_vcount, .mbt_social_floating.st_plusone_vcount, .st_email{
    margin-left:5px;
}
.mbt_social_floating .st_fblike_vcount{
    margin-left:5px;
}
.mbt_social_floating .stButton_gradient{
    background:none !important;
    height:21px !important;
    padding-left:0 !important;
}
.mbt_social_floating .chicklets, .mbt_social_floating .stMainServices {
    background:url(&#39;http://s15.postimage.org/g035bs0mv/gc_social_sprite.png&#39;) no-repeat !important;
    height:19px !important;
    width:45px !important;
    padding:0 !important;
}
.st_email .chicklets{
    background-position:0 -77px !important;
    background-image:url(&#39;http://s2.postimage.org/6839vsbxh/gc_social_sprite_gif_sthash_hi_IGrs_Zr.png&#39;) !important;
}
.mbt_social_floating .st_twitter_vcount .st-twitter-counter{
    background-position:0 -58px !important;
}
.mbt_social_floating  .stButton_gradient{
    border:none !important;
}
.mbt_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;
}
.mbt_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;
}
.mbt_social_floating .stBubble{
    background-position: 21px 31px !important;
    height:35px !important;
}
</style>

<div class='mbt_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});</script>
    <span class='st_fblike_vcount' displaytext=''/>
    <span class='st_twitter_vcount' displaytext='' st_via='mywaytoblogging'/>
<div style='margin:5px 0 0px 0;'>
<center><a class='pin-it-button' count-layout='vertical' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'>Pin It</a>
<a href='javascript:void(run_pinmarklet())' style='margin-left:-46px; width:43px; height:20px; display:inline-block;'/>
<script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/>
<script type='text/javascript'>
function run_pinmarklet() {
var e=document.createElement(&#39;script&#39;);
e.setAttribute(&#39;type&#39;,&#39;text/javascript&#39;);
e.setAttribute(&#39;charset&#39;,&#39;UTF-8&#39;);
e.setAttribute(&#39;src&#39;,&#39;http://assets.pinterest.com/js/pinmarklet.js?r=&#39; + Math.random()*99999999);
document.body.appendChild(e);
}
</script> </center>
</div>
<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: &quot;ProBWidgets&quot;,
ui_header_color: &quot;#ffffff&quot;,
     ui_header_background: &quot;#0080FF&quot;
}
</script>
<span class='st_email' displaytext=''/>
<p style=' line-height:0px; font-size:10px; font-weight:bold; text-align:center;'><a href='http://myway2blogging.blogspot.com/2012/08/add-stylish-floating-bar-to-increase.html' style='color:#CAC8C8;'>Add this</a></p>
</div>
</b:if></b:if>
Change MyWayToBlogging with your Twitter account..
Save your  Template.

You may need to change your template so we share with you some here:
That's all my dear readers, it easy, doesn't it ? that's it for this first issue. I hope you enjoyed it, please feel free to share it with anyone you think may enjoy it 2.
Like the Post? Share with your Friends:-

Team SB
Posted By: Team SB
Comment Using

Comment Policy : We’re enthusiastic to see your comment. However, Please Keep in mind that all comments are moderated manually by our human reviewers according to our comment policy, and all the links are nofollow. Using Keywords in the name field area is forbidden. Let’s enjoy a personal and evocative conversation.

5 comments :

  1. Thanks lot for providing valuable links… I have really enjoyed exploring all these websites… Thank you for interesting links..

    ReplyDelete
  2. http://fantasymaza.blogspot.com/

    ReplyDelete

Download our app on Google Play Store

Contact Us

Name

Email *

Message *

 
Copyright © . Skill Blogger . All Rights Reserved.
Designed by :- Way2themes