Add Facebook popup like box to blog

Add Facebook popup like box to blog

Add Facebook popup like box to blog and hijack your blog with huge traffic, one way to make stay tuned of your visitors is by social media and one popular way you can make your visitors visit your blog multiple times by this simple Facebook popup like box. 

How this Facebook popup like box to blog works: This is a simple plugin pops up when your blog/website loads, that makes your viewer to like your page on Facebook this is a simple one so there is no timer it will be popped up till the user reacts to close or like your page, This displays your Facebook page profile picture, and like button, and your Facebook page fans who are interested in your blog/website.

Live Demo: Add Facebook popup like box to blog

Live Demo

How to Add Facebook popup like box to blog

Step 1: First Go to blogger dashboard and select Template

Step 2: Backup your template and click EDIT HTML

Step 3: Click Ctrl + F and find </body> 

Step 4: Final step is to paste the given code just above </body>

<!-- FACEBOOK LIKE BOX POPUP WIDGET -->
<style type="text/css">
* html #tpfanbox{position:absolute}
#tpfanbox{display:block;top:0px;left:0px;width:100%;height:100%;margin:0;overflow-y:auto; z-index:9999}
#tpfanboxx{background-color:#fff;overflow:none}
.tpfanboxx{width:320px;height:380px;position:fixed;top:45%;left:50%;margin-top:-200px; margin-left:-200px;border:7px solid #6D85B5;padding:20px;z-index:9999}
.tptitle{background:#3B5999;color:#fff;font-size:16px !important;font-weight:bold;margin:5px 0;border-left:20px solid #6D85B5;padding:10px;line-height:25px;font-family:Arial !important; float:left;z-index:9999}
</style>
<!--[if lte IE 6]>
<style type="text/css">
/*<![CDATA[*/
html {overflow-x:auto;overflow-y:hidden}
/*]]>*/
</style>
<![endif]-->
<div id="tpfanbox">
<div id="tpfanboxx" class="tpfanboxx">
<h3 class="tptitle">GET ALL UPDATES VIA FACEBOOK JUST PRESS <img alt="Like" style="vertical-align:middle" src="http://goo.gl/bX6c0" /> BUTTON</h3>
<center><iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FFACEBOOK_PAGE_NAME&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe></center>
<br/>
<center style="float:left; margin-left:10px;cursor:pointer;"><a style=" font-size:xx-small; color:#3B78CD; text-decoration:none;" onmouseup="document.getElementById('tpfanbox').style.display='none'">[X] CLOSE</a></center>
<center style="float:right; margin-right:10px;"><span style="font-size:xx-small; color:#000; text-decoration:none;">+Get this at</span> <a target='_blank' style="font-size:xx-small; color:#3B78CD; text-decoration:none;" href="http://btctrickz.blogspot.in/2015/06/add-facebook-popup-like-box-to-blog.html">BTCtrickz</a></center>
</div></div>
<!-- FACEBOOK LIKE BOX CSS POPUP WIDGET -->

Now replace the FACEBOOK PAGE NAME in yellow color of your Facebook page of your website/blog.

Now check your blog/website with a new simple plugin of Facebook like popup box,

Like us on FACEBOOK and TWITTER .

Leave us a reply and comments.