Header Ads

ad728
  • Breaking News

    Floating Facebook Like Box for Blogger

    new Floating Facebook Like Box for Blogger
    Good evening, from Openfile

    Today I will show you a very beautiful but practical Blogger Widget.
    I refer to Facebook Like Box but to "side button" as in the above picture.

    It's a pretty useful Gadget that every blog should have, since:
    Saving enough space for your sidebar is important for any blogger.
    You win Likes by making facebook like box more visible to your visitors.
    But let's see how you will install it on your blog:

    1) Sign in to Blogger
    2) Design
    3) Add Gadget
    4) HTML / JavaScript
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    //<!--
    $(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
    //-->
    </script>
    <style type="text/css">
    .w2bslikebox{background: url("http://1.bp.blogspot.com/--tscpVzcBjo/TdUarKtcAlI/AAAAAAAAA3I/qVkypiYO9rc/s150/w2b_facebookbadge.pn") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
    .w2bslikebox div{border:none;position:relative;display:block;}
    .w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
    .w2bslikebox span a{color: #808080;text-decoration:none;}
    .w2bslikebox span a:hover{text-decoration:underline;}
    </style><div class="w2bslikebox" style=""><div>
    <iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2Fbloggertricksgr&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp; connections=12&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe><span>Widget by:<a href="http://www.bloggertricks.gr">Blogger Tips</a></span></div></div>
    Done

    No comments

    Post Top Ad

    ad728

    Post Bottom Ad

    ad728