Ajouter Le Gadget Flottant Fans Facebook

Aujourd'hui, je voudrai vous présenter le gadget module social Facebook (Fans sur Facebook).

Flottant sur votre blogs. Au repos, le gadget affiche juste un petit logo Facebook sur le coté droit de votre blog et il reste fixé au même endroit. 

Lorsque la souris passe sur le logo, celui-ci s'étend pour afficher le Module social Facebook, un échantillon  des Fans de votre blog sur Facebook ainsi que la possibilité de devenir Fan en aimant la page où d'y aller en cliquant sur son nom.

Pour avoir ce gadget sur votre blog, suivez les instructions ci-dessous :

 1. Connectez vous à Blogger et cliquez sur "Modèle ➢ Modifier le code HTML".
 2. Cherchez la balise </head>, en cliquant sur Ctrl+F, et copiez / collez ce code juste avant.

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>

N'oubliez surtout pas d'enregistrer votre modèle.
3. Aller sur "Mise en page➢ Ajouter un gadget ➢ HTML/Javascript"
4. Copiez / collez le code suivant dans votre nouveau Gadget HTML/Javascript :

<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/-UuBsjDC5vSc/TuiSd0g9bHI/AAAAAAAAAyk/MqKt8IpiIVM/s1600/facebook1.png") 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: 10px;font: 9px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;} 
.w2bslikebox span a{color: #FF9D00;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://www.facebook.com/pages/Guiplap/198455533612666&amp;
width=245&amp;colorscheme=light&amp;show_faces=true&amp; connections=8&amp;stream=false&amp;header=false&amp;height=330" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 330px; width: 245px;background:#fff;"></iframe><span><a href="http://guiplap.blogspot.com/2013/04/ajouter-le-gadget-flottant-fans-facebook.html">Avoir ce gadget</a></span></div></div>

Remplacez l'URL en rouge par celle de votre page Facebook, ensuite cliquez sur "Enregistrer" et allez le voir sur votre Blog.