Add Floating Facebook Like Box In Your Blog

Facebook followers is one factor that decides your blog future, So it is very important to maintain and keep your FB page up to date.Floating Facebook like box is one of the remedy for getting more followers and likes for your Facebook page.This Floating widget can be used by all blogs on every platforms that support Adding HTML/Javascript to their blog.

Preview :
This is the preview of how floating Facebook like box will appear on your Blog.

<script>(function(d, s, id) {   var js, fjs = d.getElementsByTagName(s)[0];   if (d.getElementById(id)) return;   js = d.createElement(s); = id;   js.src = “//″;   fjs.parentNode.insertBefore(js, fjs); }(document, ‘script’, ‘facebook-jssdk’));</script> <br /> <!–IPEE World Facebook POPUP LikeBox With Timer Code Start –> <script src=”” type=”text/javascript”></script> <style type=”text/css”> #exepopup{background-color:#fff;position: fixed;top:50%;z-index:9999;display:none;padding:0px;left:50%;border:10px solid rgba(82, 82, 82, 0.7);-webkit-background-clip: padding-box; /* for Safari */background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */-webkit-border-radius:8px 8px 8px 8px;-moz-border-radius:8px 8px 8px 8px;border-radius:8px 8px 8px 8px;width:400px;height:360px;margin-left:-200px;margin-top:0px;overflow:hidden;}#exepopup span{font-size:20px !important;font-weight:bold !important;}#exepopup h1{background:#6d84b4 url( 98% no-repeat;border:1px solid #3b5998 !important;color:#FFFFFF !important;font-size:20px !important;font-weight:700 !important;padding:5px !important;margin:0 !important;font-family:'”lucida grande”,tahoma,verdana,arial,sans-serif !important;overflow:hidden !important;}.exepopupdata{font-size:12px !important;font-weight:normal !important;height:265px !important;padding:1px !important;background:#fff !important;border-bottom:2px solid #ddd;overflow:hidden !important;}#exepopupfooter{text-align:left;background:#F2F2F2 !important;height:56px !important;padding:10px 10px 10px 10px !important;overflow:hidden !important;}#exepopupclose{float:right;background-color:#eee !important;border:1px solid #ccc !important;color:#111 !important;font-weight:bold !important;padding:5px 8px 5px 8px !important;text-decoration:none !important;display:inline-block !important;font-family:'”lucida grande”,tahoma,verdana,arial,sans-serif !important;outline:none !important;position:relative !important;font-size:18px !important;margin:1px !important;}#exepopupclose:active{top:1px;left:1px;}</style> <script type=”text/javascript”> jQuery(document).ready(function() { function exepopupfunc() { var sec = 10 var timer = setInterval(function() { $(“#exepopupfooter span”).text(sec–); if (sec == 0) { $(“#exepopup”).fadeOut(“slow”); clearInterval(timer); } },1000); var exepopupwindow = jQuery(window).height(); var exepopupdiv = jQuery(“#exepopup”).height(); var exepopuptop = jQuery(window).scrollTop()+50; jQuery(“#exepopup”).css({“top”:exepopuptop});} jQuery(window).fadeIn(exepopupfunc).resize(exepopupfunc) //alert(jQuery.cookie(‘sreqshown’)); //var exepopupww = jQuery(window).width(); //var exepopupwww = jQuery(“#exepopup”).width(); //var exepopupleft = (exepopupww-exepopupwww)/2; var exepopupleft = 500; //var exepopupwindow = jQuery(window).height(); //var exepopupdiv = jQuery(“#exepopup”).height(); //var exepopuptop = (jQuery(window).scrollTop()+exepopupwindow-exepopupdiv) / 2; jQuery(“#exepopup”).animate({opacity: “1”, left: “0” , left: exepopupleft}, 0).show(); jQuery(“#exepopupclose”).click(function() { jQuery(“#exepopup”).animate({opacity: “0”, left: “-5000000″}, 1000).show();});}); </script> <div id=”exepopup”> <h1> Join Us On Facebook</h1> <div class=”exepopupdata”> <iframe allowtransparency=”true” frameborder=”0″ scrolling=”no” src=”;width=400&amp;colorscheme=light&amp;show_faces=true&amp; border_color=%23fff&amp;stream=false&amp;header=false&amp;height=250″  style=”border: none; height: 250px; overflow: hidden; width: 400px;”></iframe></div> <div id=”exepopupfooter”> Please Wait <span>10</span> Seconds…!!!<a href=”” id=”exepopupclose” onclick=”return false;”>Skip</a></div> </div> <!–IPEE World Facebook POPUP LikeBox With Timer Code End –> <span><span></span></span> 

Let’s Start
Go to Dashboard > Layout > Add a Gadget
Choose HTML/Javascript  option
Now paste the above given code to the space provided
WordPress (Self Hosted)
Self Hosted Worpdress users Red this article : How to Add Floating Like Box on Your WP Blog
Reading this article will make you how to add like box on your wordpress blog
Other CMS
Add below given style sheet to your Blog Header.php
Add the above given HTML tags  in your Text widget and save

About the author

Astro Joseph

Hey Guys, I'm Astro K Joseph, Founder and CEO of IPEE World from Kerala, India. I started this blog as a passion and it now empowering thousands of readers around the globe.Here I usually share stuff related to How To, Android, Windows, Facebook, WhatsApp, Blogging, etc.

Leave a Comment