Κινουμενο like box για το facebook στο blog

Πως να βαλω floating like box στο blog μου

Γεια σας παιδια σημερα θα πουμε πως να βαλουμε ενα κινουμενο like box στο blog μας για το facebook για να μπορουν οι επισκεπτες μας να κανουν like στη σελιδα μας.
floating like box για το facebook στο blog
Το καλο ειναι πως κριβεται δεξια στην οθονη και μας εξικονωμει χορο ωστε να μπορουμε να βαλουμε και αλλα gadget.

παιρνουμε τον παρακατω κωδικο και τον βαζουμε σαν γκατζετ στο blog μας.



δειτε κι αυτα:
Like Box Νεο
 Facebook Like Button For Blogger




<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() {$(".floatinglikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.floatinglikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtvXHYO-iHFDOgfpiBaJx77YavqbRaTXN6f6eNIk25KzaXwNZvN98vYIUkeF5gNLYjq2t4wQjTJTh7tiwARxwkjkvQhjT81byWHchB6krRxOmbwSocQh5-fRKkm0kM1lUa6aUlEt8EKsc/s1600/floatingfb.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 40px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.floatinglikebox div{border:none;position:relative;display:block;}
.floatinglikebox span{bottom: 10px;font: 10px tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.floatinglikebox span a{color: #808080;text-decoration:none;}
.floatinglikebox span a:hover{text-decoration:underline;}
</style><div class="floatinglikebox" style="">
<div>
<iframe src="//www.facebook.com/plugins/likebox.php?
href=https://www.facebook.com/pages/Πως-φτιαχνω-blog-pos-ftiaxno-blog/427751680643253?ref=hl&width=251&height=270&colorscheme=light&show_faces=true&border_color=%23cccccc&stream=false&header=false&" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:251px; height:270px; background:#fff;" allowtransparency="true">
</iframe><p style=" float:right; margin-right:35px; font-size:7px;" >Powered By | <a style=" font-size:7px; color:#3B78CD; text-decoration:none;" href=https://posftiaxnoblog.blogspot.com/p/blogger-widgets.html />blogger widgets</a></p>
</div>
</div>
</div>
</div>


 πρεπει να αλαξουμε αυτη τη φραση https://www.facebook.com/pages/Πως-φτιαχνω-blog-pos-ftiaxno-blog/427751680643253 με το λινκ της δικης μας σελιδας στο facebook
το αποτελεσμα φενεται στην παραπανω εικονα

Facebook like box δευτερη εκδοση



facebook like box δευτερη εκδοση
Καινουρια πιο ανανεωμενη εκδοση με πιο κομσο στυλ 
κανουμε τα ιδια ακριβως βηματα με πιο πανω δηλαδη το βαζουμε σα gadget και δε ξεχναμε να αλλαξουμ αυτο που λεει ΕΔΩ ΤΟ ΛΙΝΚ ΤΗΣ ΣΕΛΙΔΑΣ ΣΑΣ με το λινκ της σελιδας σας στο facebook
Οριστε ο κωδικος

<style>img,a{border:0;}#on{visibility:visible;}#off{visibility:hidden;}#facebook_div{width:196px;height:353px;overflow:hidden;}#facebook_right{z-index:10005;border:2px solid #3c95d9;background-color:#fff;width:196px;height:353px;position:fixed;right:-200px;}#facebook_right img{position:absolute;top:-2px;left:-35px;}#facebook_right iframe{border:0px solid #3c95d9;overflow:hidden;position:static;height:360px;left:-2px;top:-3px;}#facebook_left{z-index:10005;border:2px solid #3c95d9;background-color:#fff;width:196px;height:353px;position:fixed;left:-200px;}#facebook_left img{position:absolute;top:-2px;right:-35px;}#facebook_left iframe{border:0px solid #3c95d9;overflow:hidden;position:static;height:360px;right:-2px;top:-3px;}</style><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script><script type="text/javascript">jQuery(document).ready(function(){ jQuery("#facebook_right").hover(function(){ jQuery(this).stop(true,false).animate({right:  0}, 500); },function(){ jQuery("#facebook_right").stop(true,false).animate({right: -200}, 500); }); jQuery("facebook").hover(function(){ jQuery(this).stop(true,false).animate({right:  0}, 500); },function(){ jQuery("facebook").stop(true,false).animate({right: -303}, 500); });    });</script><div id="on">
<div id="facebook_right" style="top: 18%;">
<div id="facebook_div">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmkq5CU15lD9XnWCQDSCrT2QS1B-eRnavmHETv0yWKAqu3b3krIhqdvgt4fJPmOIup72QWpWNN9C_1InyV5UfoaoI6adSXUxbHn_WOJ96oxaEdpY33abO2Zm4HSygZfLgA0e6oplmxSpk/s1600/helperblogger.com-facebook-icon.png" alt="" /><iframe src="//www.facebook.com/plugins/likebox.php?href=ΕΔΩ ΤΟ ΛΙΝΚ ΤΗΣ ΣΕΛΙΔΑΣ ΣΑΣ ΣΤΟ ΦΑΨΕΒΟΟΚ&&width=200&height=348&colorscheme=light&show_faces=true&border_color=%23ffffff&stream=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:200px; height:348px;" allowtransparency="true"></iframe><p style=" float:right; margin-right:35px; font-size:7px;" >Powered By | <a style=" font-size:7px; color:#3B78CD; text-decoration:none;" href=https://posftiaxnoblog.blogspot.com/p/blogger-widgets.html />blogger widgets</a></p>
</div>
</div>
</div>


facebook like box 3η εκδοση


floating like box
μπαινει και αυτο σα gadget και δε ξεχναμε να αλλαξουμε εκει που λεει
 "εδω το url της σελιδας  στο facebook" με τη σελιδα σας.
και εδω ειναι ο κωδικος

<script type="text/javascript">/*<![CDATA[*/jQuery(document).ready(function() {jQuery(".noopslikebox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);});/*]]>*/</script><style type="text/css">.noopslikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBcRccnZFmXw2wcnBXsngnzp2FUFL5S2gExPMbAGghBe1-1gw3SxzjGIYFAYGoNeq5ySt7MKAUymzwQNEpDobO84QfT6Qnc44Jkl47wE4FcLie-wAP5wt_5jXPfMrtca4f8YubAXNgUwQ/s1600/fb_static+button.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 42px;width: 245px;z-index: 9999999;position:fixed;right:-250px;top:20%;}.noopslikebox div{border:none;position:relative;display:block;}.noopslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 7px;text-align: right;z-index: 999;}.noopslikebox span a{color: gray;text-decoration:none;}.noopslikebox span a:hover{text-decoration:underline;}</style><div class="noopslikebox">
<div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=εδω το url της σελιδας σας στο facebook?ref=hl&width=245&colorscheme=light&show_faces=true&connections=9&stream=false&header=false&height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe></div>
</div>

12 Σχόλια

Νεότερη Παλαιότερη