Wednesday, August 26, 2015

How to Make Social Like Button Sticky Floating

How to Make Social Like Button Sticky Hovering in blog, Buddy bloggers, social Like button sticky this is a widget social located on the edge of the template, in the mean sticky it is attached and this widget is also floated, widgets social like this also appears on all pages, for the advantage is to facilitate that visitor clicks the button like social media contained in a posting or blog, even though these widgets appear on all pages but its placement was indeed not menggagu reader, because you can put it on the edge of the template or the left side of the template, okay buddy blogger, if you want to make a sticky social widgets like this, please follow the tutorial.

How To Create Fixed Position Share Box Using CSS

Cara Membuat Social Like Button Sticky Melayang

How to Make Social Like Button Sticky Floating

1. Open an account blogger.
2. Select the layout menu> Add widget> Choose HTML / Java script.
3. Then paste the code below in the right column pop-up that appears

<!-- floating share bar Start www.unlimitedtexting.gq-->
<style type="text/css">
#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;/*bs-fsmsb*/margin:5px 5px 0 5px;}
</style>
<div id='pageshare' title="Get this from madamvia.web.id">
<div class='sbutton' id='like' style='margin-left:8px;'>
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-send="false" data-layout="box_count" data-width="40" data-show-faces="false"></div>
</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='gplusone'>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<g:plusone size="tall"></g:plusone>
</div>
<div style="clear: both;font-size: 9px;text-align:center;">Get <a href="http://www.unlimitedtexting.gq/">widget</a></div><!-- Do not remove this link -->
</div>
<!-- floating share bar End --> 

4. Click save.

Note: In order for the widget appears on the left side of the template, make sure put the widget placement as the example shown below.


Done !! OK bloggers, I think it is enough to tutorial How to Make Social Like Button Sticky Floating on a blog, for more and lack I apologize.